💾 Blob – фоторамка с подвижными границами. Область фотографии отталкивается от курсора и почти сразу возвращается на свое место.

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

🐙 Open UI – инструмент для создания верстки с помощью нейросети. На основе текстового описания генерируется дизайн и код страниц.

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

✍️ Anton – адаптация традиционного рекламного шрифта без засечек для экранов цифровых устройств. Пример можно увидеть в сниппете Template Plants Animated

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

💾 X-Ray Text Hover Effect – эффект "рентгена" для текста. При наведении курсора он показывает только обводку букв и убирает их заливку.

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

🎨 Цветовая палитра макета "Virtual Reality Landing Page Concept"

HEX | RGB
#FAB9F1 | rgb(250,185,241)
#524686 | rgb(82,70,134)
#270631 | rgb(39,6,49)

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

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

💾 Text Particle – текст, составленный из множества мелких анимированных частиц. С помощью панели управления можно менять скорость, направление движения, отступ и время существования частицы.

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

💾 Bouncy Star Rating – прыгающие звездочки для рейтинга. Если между двумя нажатыми элементами есть другие, то анимируются сразу все последние звездочки.

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

💾 Transform Toggles – переключатель карточек на чистом CSS. В активном состоянии фон становится непрозрачным, а нижняя линия растягивается на всю ширину карточки.

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

✍️ Aglet Mono – моноширный шрифт со скругленными буквами, который подходит для небольших заголовков. Пример можно увидеть в сниппете Single Keyframe Tricks

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

🖥 Dream Job App – обложка для мобильного приложения в оттенках светло-зеленого и оранжевого. Его фишки - контраст, геометрические фигуры и шрифт с засечками.

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

🐙 Eidos – альтернатива приложению Notion, которая работает оффлайн. Проект написан на языке TypeScript и имеет открытый исходный код.

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

💾 CSS Responsive House – анимированная иллюстрация, которая меняется в зависимости от положения шкалы. Этот прием можно использовать в карточках товаров и на сайтах недвижимости.

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

🎨 Цветовая палитра макета "Beauty And Skincare Landing Page"

HEX | RGB
#D1E3E3 | rgb(209,227,227)
#93CCDF | rgb(147,204,223)
#2B6477 | rgb(43,100,119)

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

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

💾 Check Micro Animation – анимация со звуком, при которой чекбокс заполняется градиентом и появляются дополнительные элементы вокруг.

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

🖥 Cosmetic & Skin Care Branding – дизайн для бренда косметики. Самое интересное здесь - шрифты, яркие цвета и графическое оформление карточек.

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

💾 3D Preloader – необычный 3D-лоадер с элементами в виде подвижных столбиков. Чем выше столбик, тем ярче он окрашивается в синий цвет.

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

🐙 Academic Pages – готовый шаблон GitHub Pages для научных сайтов, в который можно подгружать PDF-файлы. Подходит для размещения публикаций, постов, портфолио, лекций и резюме.

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

✍️ Fjalla One – экранный шрифт без засечек средней контрастности. Имеет хорошую читаемость и приспосабливается к разным размерам экранов. Пример шрифта есть в сниппете Hamburgers

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

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

HEX | RGB
#B7CBCC | rgb(183,203,204)
#FF8041 | rgb(255,128,65)
#2C696C | rgb(44,105,108)

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

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

💾 Cylinder Toggle – объемный переключатель в виде бочонка с реалистичной тенью. После нажатия он перекатывается и меняет цвет.

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

🖥 Fender Bender Guitar Tune – концепт дизайна приложения для музыкального магазина. Его особенности – это сочные цвета, контрасты, ретро-шрифты и черные контуры у карточек.

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