Generator palet kolorów
Generuj harmonijne palety kolorów z dowolnego koloru bazowego. Obsługuje schematy dopełniające, analogiczne, triadyczne i monochromatyczne.
Complementary
#6366F1#F1EE63Analogous
#63ADF1#6366F1#A763F1Triadic
#6366F1#F16366#66F163Split Complement
#6366F1#F1A763#ADF163Tetradic
#6366F1#F163AD#F1EE63#63F1A7Monochromatic
#0F13AC#1D21EB#6366F1#A1A3F7#D0D1FBJak korzystać z tego narzędzia
- 1
Click the color swatch to open your system color picker, or type a 6-digit hex code like #6366F1 into the text field next to it.
- 2
Watch the six scheme rows update instantly as you change the base color.
- 3
Read the uppercase hex code shown in the bottom-left corner of each swatch and copy the ones you want into your design tool or stylesheet.
Czym jest generator palet kolorów?
Teoria koloru definiuje relacje harmoniczne na podstawie pozycji na kole barw. Kolory dopełniające leżą po przeciwnych stronach (180°). Analogiczne sąsiadują ze sobą (30°). Schematy triadyczne wykorzystują trzy równo oddalone kolory (120°). To narzędzie oblicza każdy z nich na podstawie wybranego przez Ciebie koloru bazowego, dając paletę wyjściową opartą na sprawdzonej teorii koloru.
Typowe przypadki użycia
Picking a primary plus accent color for a website by reading the complementary pair off your brand color.
Building a calm, unified UI background-and-card scheme from the analogous row.
Generating a 5-step monochromatic tint and shade ramp for hover, active, and disabled button states.
Sketching a data-visualization palette where triadic or tetradic colors keep series visually distinct.
Exploring logo or illustration color combinations before committing in Figma or Illustrator.
Quickly grabbing hex codes for a CSS variable set without leaving the browser.
Najczęściej zadawane pytania
Który schemat jest najlepszy dla stron internetowych?▼
Powiązane narzędzia
Konwerter kolorów (HEX/RGB/HSL)
Konwertuj kolory między formatami HEX, RGB i HSL. Wybierz kolor wizualnie lub wprowadź wartości ręcznie.
Generator box-shadow CSS
Twórz wizualnie wartości box-shadow w CSS. Podgląd w czasie rzeczywistym i kopiowanie wygenerowanego CSS.
Generator gradientów CSS
Twórz liniowe i radialne gradienty CSS. Wybieraj kolory w sposób wizualny i kopiuj wygenerowany kod CSS.
Generator krzywych przyspieszenia cubic-bezier
Twórz krzywe przyspieszenia cubic-bezier dla CSS. Zawiera standardowe ustawienia predefiniowane.
Generator border-radius CSS
Twórz wizualnie złożone wartości border-radius w CSS. Niezależna kontrola każdego rogu.
Generator CSS clamp()
Generuj płynne, responsywne wartości CSS za pomocą clamp(). Skaluje się gładko między rozmiarem minimalnym a maksymalnym w zakresach widoku.