Към съдържанието

CSS Gradient генератор

Създайте красиви CSS преливания визуално с преглед на живо. Поддръжка на линейни, радиални и конични градиенти. Добавете цветни стопове, коригирайте ъгли. Копирайте CSS кода. Безплатен онлайн инструмент.

Тип градиент
90°
Цветни стопове
CSS изход
 

Какво са CSS градиентите?

CSS градиентите ви позволяват да показвате плавни преходи между два или повече определени цвята. CSS предоставя три типа градиенти: linear-gradient (върви по права линия), radial-gradient (излъчва се от централна точка) и conic-gradient (завърта се около централна точка).

Типове градиенти

Линейните градиенти преливат цветове по права линия, определена от ъгъл. Радиалните градиенти излъчват навън от централна точка в елиптична или кръгова форма. Коничните градиенти завъртат цветовите преходи около централна точка, като цветно колело.

Цветни стопове

Цветните стопове определят цветовете в градиента и техните позиции по линията на градиента. Можете да добавите множество стопове, за да създадете сложни многоцветни градиенти. Всеки стоп има стойност на цвят и незадължителен процент на позиция.

Поверителност

Цялото генериране на градиенти работи 100% във вашия браузър. Никакви данни не се изпращат на сървър.