Generator gradientów CSS

Ręczne pisanie linear-gradient(135deg, #2193b0 0%, #6dd5ed 100%) i przeładowywanie strony, aby go zobaczyć, to powolna pętla. Ten generator ją zamyka: wybierz liniowy, promienisty lub stożkowy, przeciągnij suwak kąta, ustaw każdy punkt koloru za pomocą natywnego selektora koloru i pozycji procentowej — a podgląd na pełną szerokość odświeża się przy każdej zmianie, z gotową linią tła zawsze pod ręką.

Trzy typy gradientów obsługują różne zadania. Gradienty liniowe przechodzą wzdłuż kierunku i niosą większość sekcji hero i przycisków; gradienty promieniste promieniują od środka dla poświat i winiet; gradienty stożkowe obiegają środek i napędzają wykresy kołowe i koła kolorów. Możesz przełączać typy w dowolnym momencie — twoje punkty są przenoszone, więc porównanie trzech zajmuje sekundy.

Maksymalnie sześć punktów koloru daje przestrzeń na wielopasmowe projekty, a strony z predefiniowanymi zestawami dostarczają sprawdzonych kombinacji — ciepły zachód słońca, spokojny ocean i miękką pastelową parę — jako punkty wyjścia do dalszych modyfikacji, a nie puste płótna. Zwróć uwagę na podział pracy: generator palet kolorystycznych na tej stronie dobiera harmonijne płaskie kolory, a konwerter formatów kolorów tłumaczy wartość między HEX, RGB i HSL, podczas gdy to narzędzie wykonuje inne zadanie — zamienia wybrane kolory w gotowy kod gradientu CSS.

Wszystko działa lokalnie w twojej przeglądarce: bez wysyłania, bez konta, bez komunikacji z serwerem, a generator działa offline po załadowaniu.