Сайтодел | GitHub, Верстка, Сайты, Вайбкодинг

💾 Animated Text Fill – анимированная заливка для текста, написанная без JavaScript. В основе фона для заливки – изображение в формате PNG.

Сайтодел | #сниппет #css

1.47K views14:38

✍️ Lilita One – экранный шрифт, который подходит для заголовков и коротких текстов. Слегка сжатая структура и некоторые привлекающие внимание детали добавят странице индивидуальности.

Сайтодел | #шрифт

1.4K views07:11

0:04

💾 Signature Animation – поле ввода, которое превращает текст в имитацию рукописной подписи. Эффект работает только с латиницей.

Сайтодел | #сниппет #css

1.29K views14:28

🎨 Цветовая палитра макета "Skincare App Concept"

HEX | RGB
#FFCCD3 | rgb(255,204,211)


#D16F9A

| rgb(209,111,154)
#711C47 | rgb(113,28,71)

⚠️ Цвет копируется одним кликом!

Сайтодел | #палитра

1.33K views18:28

Forwarded from Исходный Код

ИИ может быстро собрать DatePicker, но доступным по WCAG он от этого не становится.

ℹ️ На Хабре новая статья

Разобрали кейс, где Claude помог с каркасом React-компонента, а дальше началась нормальная инженерная работа: тесты, правки, проверки на реальных сценариях и решения, которые не всегда совпадают со спецификацией один в один.

❓ Ответили на главный вопрос:

Где ИИ правда экономит время, а где без ручной доводки получается «почти работает»?

ℹ️ Если делаете интерфейсы на React и не хотите получить формально доступный, но неудобный компонент, вот разбор по делу.

🔗

Читать статью на Хабре!

Please open Telegram to view this post

VIEW IN TELEGRAM

1.26K views07:10

0:08

💾 Wave – анимация загрузки, похожая на волну. Элемент построен из линий, которые меняют свою длину и тем самым создают очертания предмета.

Сайтодел | #сниппет #css

1.22K views08:56

✍️ Aston Script – каллиграфический шрифт с витиеватыми заглавными и строчными буквами. Пример использования можно посмотреть в заголовках макетов Colour Palettes/Moodboards

Сайтодел | #шрифт

1.2K views15:04

0:05

💾 Inner Glow Card – прозрачная карточка с внутренней неоновой подсветкой. Рамка имеет волнообразную анимацию, цвета плавно перетекают друг в друга.

Сайтодел | #сниппет #css

1.19K views18:38

🐙 Aos – библиотека анимаций для JavaScript, сокращенно от "Animate On Scroll". Она позволяет не только пользоваться готовыми анимациями скролла, но и кастомизировать их для любого проекта.

Сайтодел | #репозиторий #github

1.32K views19:30

0:05

💾 Cards – карточки, которые разворачиваются как книжка. В каждой из них есть анимированная кнопка и место для изображения.

Сайтодел | #сниппет #css

1.31K views08:32

🖥 Travalizer – макет приложения с советами для путешественников. Теплые оттенки зеленого и кремового ассоциируются с природой и отпуском.

Сайтодел | #макет #figma

1.22K views15:54

💾 CSS3 Speedometer Emoji Gauge – шкала оценки, где каждой реакции соответствует свой цвет и эмодзи. Перетаскивать можно только бегунок на горизонтальной шкале.

Сайтодел | #сниппет #css

1.33K views17:47

🐙 JSON Server – это библиотека с фейковыми REST API. Она поддерживает динамическую генерацию "баз данных", кастомную маршрутизацию и использование модулей.

Сайтодел | #репозиторий #github

1.44K views17:25

0:06

💾 Loader – спиннер в виде капли, которая пульсирует и распадается на части. У каждого элемента есть падающая тень.

Сайтодел | #сниппет #css

1.28K views04:23

🐙 Clean Code JavaScript – репозиторий с материалами по чистому коду применительно к JavaScript. Для каждого концепта тут есть примеры хорошего и плохого кода.

Сайтодел | #репозиторий #github

1.25K views06:25

0:08

💾 Image Grids Animation – анимация для картинок в виде сетки из скругленных рамок. Шаблон подстраивается под ширину каждого изображения.

Сайтодел | #сниппет #css

1.3K views10:30

0:04

💾 Atom Preloader – сложный лоадер в форме атома с элементами, которые вращаются в разные стороны. Кольца крутятся как в одной плоскости, так и по собственной оси.

Сайтодел | #сниппет #css

1.32K views19:31

💾 Order Button Animation – анимация, которая появляется после нажатия кнопки вместо лоадера. Когда заказ принят, кнопка возвращается обратно.

Сайтодел | #сниппет #css

1.23K views06:57

🐙 Transformers.js – библиотека, которая помогает обрабатывать естественный язык, генерировать и переводить тексты, классифицировать изображения, а также распознавать речь.

Сайтодел | #репозиторий #github

1.24K views08:10