Base Seed Color:
Harmony Model
Number of Colors in Palette5 Colors
Generated Palette Preview
Click any card to copy HEX#1
#3cf6af
Click to copy
#2
#3ce0f6
Click to copy
#3
#3c83f6
Click to copy
#4
#523cf6
Click to copy
#5
#af3cf6
Click to copy
:root {
--palette-color-1: #3cf6af;
--palette-color-2: #3ce0f6;
--palette-color-3: #3c83f6;
--palette-color-4: #523cf6;
--palette-color-5: #af3cf6;
}Anleitung zur Palettenerstellung
- 1Wählen Sie eine Startfarbe oder drücken Sie die Leertaste für Zufallsfarben.
- 2Wählen Sie eine Harmonieregel: Komplementär, Triadisch, Analog oder Monochrom.
- 3Kopieren Sie die Palette als CSS-Variablen oder HEX-Werte.
Farbtheorie im professionellen UI-Design
Regelbasierte Farbharmonien sorgen für visuellen Zusammenhalt und gewährleisten ausreichende Kontrastverhältnisse für Lesbarkeit.
Architecture & Privacy
- Algorithmic Color Wheel Trigonometry: Calculates exact hue angles and saturation balancing in HSL space.
- Multiple Color Export targets: CSS variables, Tailwind configuration JSON, and JSON Hex arrays.
- Automated Text Contrast detection: Determines WCAG dark/light contrast for each generated swatch.
- Zero dependencies: Pure client-side mathematical calculations rendered with zero delay.