Сайтодел | GitHub, Верстка, Сайты, Вайбкодинг
25.4K subscribers
1.34K photos
108 videos
28 files
2.39K links
FullStack-материалы от Senior-разработчика для WEB-специалистов

Сотрудничество: @CodingLead

РКН: shorturl.at/qinly
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Image Grids Animation – анимация для картинок в виде сетки из скругленных рамок. Шаблон подстраивается под ширину каждого изображения.

Сайтодел | #сниппет #css
🎨 Цветовая палитра макета "Vision UI Dashboard React"

HEX | RGB
#05CD99 | rgb(5,205,153)
#0075FF
| rgb(0,117,255)
#09235E | rgb(9,35,94)

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

Сайтодел | #палитра
This media is not supported in your browser
VIEW IN TELEGRAM
💾 SVG Polygon Generator – генератор многоугольников. Здесь можно задать количество углов фигуры, ее радиус и расположение центра. Затем многоугольник можно вставить в HTML-файл в виде тега.

Сайтодел | #сниппет #css
🐙 ApiHub – набор бесплатных API, которые можно использовать в учебных целях или для портфолио. Коллекция охватывает различные отрасли и подходит для самых разных целей проекта.

Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Dot Clock Preloader – часы, у которых стрелка формируется из маленьких квадратов. Когда все элементы собраны, часы снова распадаются на пунктирную окружность.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 GSAP Grid – сетка из анимированных SVG-изображений в ретро-стиле. Можно использовать в качестве иллюстраций для сайтов.

Сайтодел | #сниппет #css
🐙 PeerTube – видеохостинг с открытым исходным кодом, созданный на Typescript. Его главное отличие от других платформ – децентрализованное хранение данных.

Сайтодел | #репозиторий #github
✍️ Orbitron – геометрический шрифт без засечек с футуристическим дизайном. Он подходит для постеров, заголовков и обложек книг. Пример шрифта есть в дизайне "Virtual Reality Landing Page Concept"

Сайтодел | #шрифт
🎨 Цветовая палитра макета "Interior Design Website"

HEX | RGB
#CED4D2 | rgb(206,212,210)
#FFD476
| rgb(255,212,118)
#2C8879 | rgb(44,136,121)

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

Сайтодел | #палитра
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Design Wormhole – карточка с трехмерным вращением и эффектом стекла. Внизу – непрерывная анимация с исчезающим предметом.

Сайтодел | #сниппет #css
🖥 Glass Flowers 3D Assets – набор PNG-изображений стеклянных цветов. Есть три варианта картинок: золотые, сине-розовые (с фильтром) и черно-белые.

Сайтодел | #макет #figma
🐙 Text Behind Image – полезный инструмент для создания текста на заднем плане фотографии. Проект имеет открытый исходный код.

Сайтодел | #репозиторий #github
🐙 Text Behind Image – полезный инструмент для создания текста на заднем плане фотографии. Проект имеет открытый исходный код.

Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Circular Animations – девять современных минималистичных лоадеров. Фигуры состоят из одинаковых белых кружков, которые могут менять размер и прозрачность.

Сайтодел | #сниппет #css
🎨 Цветовая палитра макета "Fitstreak"

HEX | RGB
#D6E0E2 | rgb(214, 224, 226)
#D5FF5F
| rgb(213, 255, 95)
#4E6075 | rgb(78, 96, 117)

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

Сайтодел | #палитра
This media is not supported in your browser
VIEW IN TELEGRAM
💾 3D Realistic Bee – лендинг с 3D-анимацией пчелы и 3D-иллюстрациями на заднем плане. Текст находится "между" этими двумя слоями.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Metal Gear Radar States – уведомления в стиле ретро-дисплеев. Для создания атмосферы используется зернистый фон, пиксельный шрифт и приглушенные цвета.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Deconstructed Cards – два варианта карточек с эффектом зума и подвижным фоном. Текст в активном режиме становится ярче, а графика – заметнее.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Text Circle Animation – круг со словами, который можно вращать курсором. При быстром движении буквы "разлетаются" в стороны.

Сайтодел | #сниппет #css
🖥 Health Analytics App – дизайн для мобильного приложения с аналитикой здоровья. Основные черты – выдержанный стиль, насыщенные холодные тона, контрасты и отсутствие скругленных углов.

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