131 · Дизайн и уеб

CSS генератор на градиенти

Изберете цветове и ъгъл, вижте градиента на живо и копирайте CSS.

Вашите данни: Този инструмент обработва въведеното от вас в този браузър. CapyHelp не качва този вход, за да генерира вашия резултат. Подробности за поверителност

CSS генератор на градиенти

Тип
#4f46e5
#ec4899
#f59e0b

Как да използвате генератора на css градиенти

  1. Изберете линеен, радиален или коничен.
  2. Изберете два или три цвята и задайте ъгъла.
  3. Копирайте CSS във вашата таблица със стилове.

Видове градиенти

  • Линеен се смесва по права линия под избрания от вас ъгъл.
  • Радиална се простира от центъра като кръг или елипса.
  • Конична се движи около центъра като цветно колело.

Първият ред на CSS е обикновен цвят на фона за много стари браузъри.

Примери

Индиго до розово при 135°

фон: линеен градиент (135 градуса, #4f46e5, #ec4899);

Радиален кръг

фон: радиален градиент (кръг, …);

Въпроси

Работят ли градиентите във всеки браузър?

Линейните и радиалните градиенти работят във всеки настоящ браузър. Коничните градиенти работят и във всички текущи основни браузъри.

Автоматичен превод. Прегледайте важни резултати.