[Перевод] Упрощаем фоновые рисунки c помощью конических градиентов

Скрипты и советы | 30 июня 2020 1 302

Уроки CSS на Хабрахабре, habrahabr.ru, CSS, conic gradients, background patterns, css, gradient, gradient background,



Один из известных способов создания повторяющихся фоновых узоров — это применение
линейных градиентов. Но если использовать с этой же целью conic-gradient(), требуется значительно меньшее количество CSS-кода. Данное преимущество конических градиентов проиллюстрировано в статье несколькими примерами, взятыми из галереи Лии Веру.


Нам предстоит рассмотреть



орнамент из пирамид,

шахматный рисунок,

шахматный рисунок под наклоном,

фон из треугольников,

а еще нас ждет приятный бонус от автора.

Читать дальше →
[Перевод] Создание красивых градиентов на CSS

Вот линейный градиент на CSS, идущий от чисто жёлтого до чисто синего цвета: Заметили, что в центре он становится...

Подробнее
[Перевод] Улучшенные эффекты с режимом смешивания фоновых слоев в CSS

Если одна картина заслуживает тысячи слов, то смешение двух картин заслуживает гораздо большего. Точно так же,...

Подробнее
[Перевод] Градиентные тени на CSS

Мне часто задают вопрос: Возможно ли создать тени из градиентов, а не из сплошных цветов? В СSS не существует...

Подробнее
Несколько слов о градиентах

Всем привет! Сегодня хочу поговорить немного о градиентах, популярных сайтах, предоставляющих пользователям возможность...

Подробнее
[Перевод] Три способа создания клякс с помощью CSS и SVG

Кляксы (Blob) - это гладкие, аморфные, желеобразные формы, обычно причудливые и забавные. Их можно использовать в...

Подробнее
[Перевод] Нативный Masonry Layout в CSS Grid Level 3

Недавно был опубликован черновик спецификации CSS Grid 3 уровня, в котором содержится описание способа создания...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями