Projektowanie

Generator gradientów CSS

Twórz gradienty CSS wizualnie.

Układ: Generator CSS Flexbox · głębokość: Generator cieni CSS.

Jak używać

Wybierz gotowe ustawienie lub zbuduj od podstaw: dodaj punkty koloru, przeciągnij pozycje, przełącz między gradientem liniowym / promienistym / stożkowym. Skopiuj CSS lub fragment klasy Tailwind.

FAQ

Jakie typy gradientów są obsługiwane?

Liniowy (dowolny kąt), radialny (okrąg od środka) i stożkowy (koło barw). Każdy obsługuje wiele punktów kolorów z pozycjami, które można przeciągać.

Jak używać CSS?

Skopiuj wygenerowany wiersz background do arkusza stylów lub wklej go jako dowolną wartość Tailwind, np. bg-[linear-gradient(...)].

Czy mogę zacząć od ustawienia wstępnego?

Tak — kliknij dowolne z 12 ustawień (zachód słońca, ocean, radialny reflektor, stożkowa tęcza i inne), a następnie dostosuj punkty i kąty.

Ostatnia aktualizacja: