Accessible Form
Split-Complementary • 5 colors • ⚖️ Neutral
Colors
Deep Graphite
#212121RGB(33, 33, 33) • HSL(0°, 0%, 13%)
CMYK(0%, 0%, 0%, 87%)
Elegance, power, sophistication, mystery, authority
Deep Graphite
#424242RGB(66, 66, 66) • HSL(0°, 0%, 26%)
CMYK(0%, 0%, 0%, 74%)
Neutrality, balance, professionalism, maturity
Purity White
#FFFFFFRGB(255, 255, 255) • HSL(0°, 0%, 100%)
CMYK(0%, 0%, 0%, 0%)
Purity, simplicity, cleanliness, minimalism, peace
Light Sapphire
#E3F2FDRGB(227, 242, 253) • HSL(205°, 87%, 94%)
CMYK(10%, 4%, 0%, 1%)
Trust, professionalism, calm, security, loyalty
Electric Navy
#1976D2RGB(25, 118, 210) • HSL(210°, 79%, 46%)
CMYK(88%, 44%, 0%, 18%)
Trust, professionalism, calm, security, loyalty
Harmony
Monochromatic
All colors share the same hue with different lightness/saturation. Creates unity and elegance.
Temperature
Neutral
Contrast
AA: 4.5:1 · AAA: 7:1
Palette Health Score
Accessibility
Harmony
Total
= Palette Health
Accessibility Matrix (WCAG)
Contrast ratio between all color pairs. AA requires 4.5:1 for text, AAA requires 7:1.
| - | 1.6:1Fail | 16.1:1AAA | 14.1:1AAA | 3.5:1Fail | |
1.6:1Fail | - | 10.05:1AAA | 8.8:1AAA | 2.18:1Fail | |
16.1:1AAA | 10.05:1AAA | - | 1.14:1Fail | 4.6:1AA | |
14.1:1AAA | 8.8:1AAA | 1.14:1Fail | - | 4.03:1Fail | |
3.5:1Fail | 2.18:1Fail | 4.6:1AA | 4.03:1Fail | - |
Color Blindness Simulation
How this palette appears to people with different types of color vision deficiency.
Original
Protanopia (red-blind)
~1.3%Deuteranopia (green-blind)
~1.2%Tritanopia (blue-blind)
~0.01%Achromatopsia (total)
~0.003%Psychology & Meaning
Recommended Uses
Mobile Apps
Works well for mobile interfaces
Web Design
Suitable for modern websites
Palette Statistics
Type
Monochromatic
Temperature
⚖️ Neutral
Light / Dark
2 / 3
Avg Contrast
6.6:1
Hue Distribution
Color Properties
Contrast Analysis
Minimum
1.1:1
Average
6.6:1
Maximum
16.1:1
WCAG AA requires 4.5:1 for text, 3:1 for large text
Suggestions
Well balanced palette! Good variety and contrast.
Harmony Analysis
Detected Harmony
Monochromatic
All colors share the same hue with different lightness/saturation. Creates unity and elegance.
Harmony Score
Accessibility Report
Accessibility
/100
WCAG AA
PASS
Text contrast with white/black
Colorblind
WARNING
Color distinction for CVD users
Quality Criteria
Issues Found (3)
Colores 1 y 2 difíciles de distinguir (1.60:1) en modo normal
Colores 2 y 5 difíciles de distinguir (2.18:1) en modo normal
Colores 3 y 4 difíciles de distinguir (1.14:1) en modo normal
Gradients
Full linear gradient
background: linear-gradient(90deg, #212121, #424242, #FFFFFF, #E3F2FD, #1976D2);#212121 → #424242
#424242 → #FFFFFF
#FFFFFF → #E3F2FD
#E3F2FD → #1976D2
Tints & Shades
Lighter (tints) and darker (shades) variations of each color
#212121
#424242
#FFFFFF
#E3F2FD
#1976D2
Export Code
:root {
--color-1: #212121;
--color-2: #424242;
--color-3: #FFFFFF;
--color-4: #E3F2FD;
--color-5: #1976D2;
}Related Palettes
Explore variations and alternatives generated from this palette
Complementary
Opposite colors on the wheel
Analogous Shift
Shifted 30° on the wheel
Lighter Version
15% lighter
Darker Version
15% darker
Muted
30% less saturation
Vibrant
30% more saturation
Triadic Shift
Shifted 120° on the wheel
Split Complementary
Shifted 150° on the wheel
Monochromatic
Based on first color
Preview
See how your palette looks in a real landing page context
Welcome to Our Platform
Discover amazing features and boost your productivity with our innovative solutions.
Feature One
Feature Two
Feature Three
© 2026 Your Brand. All rights reserved.