💾 Changing Background Color – эффект изменения цвета фона при скролле. Его можно использовать в лендинге вместо того, чтобы создавать отдельный фон для каждого раздела.

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

💾 Hexagon Image Tiles – необычная галерея изображений, состоящая из шестиугольников. Если навести на фото курсор, то можно увидеть подпись на полупрозрачном фоне.

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

💾 Checkbox Group – набор карточек с иконками и чекбоксами. Состояние чекбокса, а также цвет иконки и рамки меняются при нажатии на карточку.

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

✍️ Avenir – гротескный шрифт, созданный Адрианом Фрутигером в 1988 году. Шрифт появился под влиянием гротескных гарнитур геометрического стиля из 1920х годов, которые использовали круг в качестве основы. Пример можно посмотреть в сниппете "Click Me"

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

🎨 Цветовая палитра макета "XIDE Serenity Springs":

HEX | RGB
#E5DFD6 | rgb(229,223,214)
#B19061 | rgb(177,144,97)
#3C2418 | rgb(60,36,24)

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

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

💾 Elastic Accordion GSAP – эластичные рамки для изображений, которые растягиваются при нажатии курсором. Подвижность элементов создает эффект "резины".

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

🖥 Online Food Ordering Website – дизайн лендинга для сервиса заказа еды. Теплые оттенки зеленого создают здесь ощущение свежести и уюта, а оранжевые элементы намекают на вкусные продукты.

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

💾 Breathe – лоадер с анимированными контурами в виде спирали. Для дизайна используется градиент из серо-голубого и светло-розового.

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

🐙 Plyr – это простой и легко настраиваемый медиаплеер, который работает с HTML5, YouTube и Vimeo и поддерживает современные браузеры.

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

✍ Lora – современный шрифт с засечками, уходящий корнями в каллиграфию. Шрифт отличается умеренным контрастом и плавными изгибами, которые контрастируют с засечками. Пример есть в сниппете "Smooth 3D Perspective Slider"

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

🎨 Цветовая палитра макета "DeepBreathe":

HEX | RGB
#F7A279 | rgb(247,162,121)
#73BA9A | rgb(115,186,154)
#8267C6 | rgb(130,103,198)

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

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

💾 Gradient Button – набор градиентных кнопок двух типов. Кнопки с прозрачным фоном при наведении курсора заполняются цветом, а уже залитые кнопки в нижнем ряду меняют оттенок.

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

🐙 Flowise – UI-кит для создания схем и ассоциативных карт из элементов веб-дизайна. Инструмент использует в своей основе фреймворк LangchainJS.

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

💾 Spinning Text – текст, каждая строка которого вращается со своей собственной скоростью вокруг вертикальной оси.

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

🖥 Smart Task Mobile Apps – яркий и насыщенный дизайн элементов мобильного приложения. В центре внимания - контраст цветных элементов и белого фона.

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

💾 Header Navigation Menu – кнопка с раскрывающимся меню сайта. Ее иконка трансформируется в крестик с помощью вращения ее элементов вокруг центра.

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

✍️ Baloo – дисплейный шрифт с полужирными закругленными буквами, разработанный в Индии. Он улучшает видимость дизайна и подходит для заголовков, карточек, открыток, а также названий фильмов. Пример есть в сниппете "Mochi Shiba"

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

🐙 Web-IIm – проект, который добавляет языковые модели нейросетей в чаты веб-браузеров и помогает создавать ИИ-ассистентов. Работает на Web GPU без поддержки сервера.

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

💾 Progress Bar – шкала шагов, которую можно переключать вручную. Подойдет для переключения вкладок с этапами какого-либо действия.

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

🎨 Цветовая палитра макета "Online Food Ordering Website":

HEX | RGB
#D0DEC4 | rgb(208,222,196)
#BECB42 | rgb(190,203,66)
#356203 | rgb(53,98,3)

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

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

💾 Hex Animation – анимированный фон, который запускается при нажатии кнопки. Элементы могут поворачиваться, менять цвет и форму.

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