Skip to main content
🎨

Narzędzia Narzędzia projektowe

Generatory CSS, narzędzia kolorów i tworzenie SVG

26 narzędzi
🎨

Przelicznik kodów kolorów

Przeliczaj między kodami kolorów HEX, RGB i HSL. Użyj próbnika kolorów i podglądu w czasie rzeczywistym do intuicyjnego wyboru kolorów.

🎨

Próbnik kolorów

Intuicyjnie wybieraj kolory za pomocą koła kolorów i suwaków. Pobieraj i kopiuj kody kolorów w formatach HEX, RGB i HSL.

🎨

Ekstraktor kolorów obrazu

Automatycznie wykrywaj dominujące kolory z obrazu i generuj paletę kolorów. Możesz też kliknąć dowolne miejsce na obrazie, aby wybrać pojedyncze kolory.

🎯

Pobieracz średniego koloru obrazu

Oblicz średni kolor całego obrazu lub wybranego obszaru. Przydatny do wybierania schematów kolorów lub kolorów tła miniatur.

🌈

Generator CSS gradient

Wizualnie twórz gradienty CSS za pomocą przeciąganych kontrolek. Obsługuje typy gradientów liniowych, radialnych i stożkowych z presetami.

🔲

Generator CSS box-shadow

Wizualnie twórz CSS box-shadow za pomocą suwaków. Obsługuje wiele cieni i cienie wewnętrzne.

Generator CSS border-radius

Generuj CSS border-radius z kontrolą poszczególnych narożników. Zawiera opcje promienia eliptycznego i popularne presety kształtów.

Generator CSS text-shadow

Generuj CSS text-shadow z podglądem na żywo. Nakładaj wiele cieni z presetami neon, wytłoczenie i innymi.

🔺

Generator trójkąta CSS

Generuj trójkąty CSS za pomocą właściwości border. Obsługuje wszystkie 8 kierunków z konfigurowalnym rozmiarem i kolorem.

✂️

Generator CSS clip-path

Wizualnie twórz kształty CSS clip-path metodą przeciągnij i upuść. Zawiera wielokąt, koło, elipsę i presety takie jak gwiazda i serce.

🪟

Generator CSS glassmorphism

Twórz efekty UI matowego szkła z podglądem na żywo i wyjściem CSS. Dokładnie dostosuj ustawienia przezroczystości, rozmycia, obramowania i cienia.

Generator CSS Loader

Wybierz spośród wielu animacji ładowania CSS i uzyskaj kod. Dostosuj kolor, rozmiar i prędkość dla spinnerów, kropek, pasków i innych.

📐

Generator CSS Flexbox

Twórz układy Flexbox wizualnie i generuj kod CSS. Dostosuj wszystkie właściwości z wbudowaną ściągawką.

📈

Generator CSS cubic-bezier

Wizualnie twórz krzywe animacji CSS. Przeciągaj uchwyty i przeglądaj animacje w czasie rzeczywistym.

🎨

Generator odcieni kolorów

Generuj warianty jasnych i ciemnych odcieni dowolnego koloru. Dostosuj liczbę kroków i eksportuj jako paletę Tailwind CSS.

🎨

Mikser kolorów

Mieszaj dwa lub więcej kolorów w określonych proporcjach, aby tworzyć nowe kolory. Porównuj wyniki w różnych przestrzeniach kolorów, takich jak RGB, HSL i LAB.

🎨

Generator palet kolorów

Generuj palety kolorów z bazowego koloru używając teorii kolorów. Zawiera kolory komplementarne, analogiczne, triadyczne i więcej schematów kolorystycznych.

🔤

Podgląd czcionek webowych

Przeglądaj czcionki webowe z Google Fonts w czasie rzeczywistym. Porównuj wiele czcionek, regulując rozmiar i kolor.

🎨

Podręcznik nazw kolorów HTML

Przeglądaj wszystkie 148 nazwanych kolorów HTML/CSS w jednym miejscu. Wyszukuj, podglądaj i kopiuj kody HEX z łatwością.

🔲

Generator wzorców tła CSS

Generuj wzorce tła przy użyciu czystego CSS. Dostosuj paski, kropki, kratki i inne za pomocą edytora wizualnego.

📜

Generator paska przewijania CSS

Dostosuj wygląd paska przewijania CSS za pomocą edytora wizualnego. Reguluj kolor, szerokość, promień zaokrąglenia i kopiuj kod bezpośrednio.

🌈

Generator tekstu gradientowego CSS

Generuj kod CSS do zastosowania gradientów na tekście. Podgląd kolorów, kierunku i zakresu w czasie rzeczywistym.

☑️

Generator pól wyboru CSS

Twórz niestandardowe pola wyboru CSS za pomocą edytora wizualnego. Swobodnie dostosuj animacje, kolory i kształty.

🔘

Generator przełącznika CSS

Twórz niestandardowe przełączniki CSS za pomocą edytora wizualnego. Dostosuj rozmiar, kolor i animację, a następnie eksportuj kod.

🫧

Generator kształtu blob SVG

Automatycznie generuj organiczne kształty blob w formacie SVG. Dostosuj losowość i złożoność do dekoracji projektów internetowych.

🔷

Generator wzorców SVG

Generuj powtarzalne wzorce kafelkowe SVG. Dostosuj typ wzorca, kolor i rozmiar, a następnie eksportuj kod.