#0A0A0A
#3D3D3D
#CCFF00
#FFFFFF
#030306Obsidian
#393C57Charcoal
#A9ADC1Heather
#D700B3Magenta
Magenta & Charcoal Breeze is a dark, split color palette tagged dark, neon, minimal. A split scheme: Charcoal plays against Magenta across roughly 76° of hue. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Obsidian | #030306 | rgb(3, 3, 6) | hsl(240, 33%, 2%) | oklch(10.0% 0.012 284) | |
| Charcoal | #393C57 | rgb(57, 60, 87) | hsl(234, 21%, 28%) | oklch(36.5% 0.047 279) | |
| Heather | #A9ADC1 | rgb(169, 173, 193) | hsl(230, 16%, 71%) | oklch(75.1% 0.029 277) | |
| Magenta | #D700B3 | rgb(215, 0, 179) | hsl(310, 100%, 42%) | oklch(59.7% 0.261 338) |
Why it works and how to use it
Two of the four colors are near-neutral, which leaves room for Magenta to lead. Lightness runs from 2% to 71%. Well suited to dark-mode interfaces and gaming.
- Background: Heather (#A9ADC1) is the lightest color, so it belongs on large surfaces.
- Text: Obsidian (#030306) on #A9ADC1 gives 9.25:1, passing WCAG AAA.
- Primary: Magenta (#D700B3) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Charcoal (#393C57) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Obsidian on Heather at 9.25:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Magenta & Charcoal Breeze
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#030306
#393C57
#A9ADC1
#D700B3
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#030306 on #A9ADC1 | Aa | 9.25:1 | AAA |
#393C57 on #A9ADC1 | Aa | 4.82:1 | AA |
#030306 on #D700B3 | Aa | 4.45:1 | AA large only |
#393C57 on #D700B3 | Aa | 2.32:1 | Fail |
#A9ADC1 on #D700B3 | Aa | 2.08:1 | Fail |
#030306 on #393C57 | Aa | 1.92:1 | Fail |
Similar palettes 24 more in this mood
#111111
#424242
#FF3B3B
#FAFAFA
#0E0E14
#3E526A
#C8CCE0
#CE62FF
#E5E6E6
#F61061
#4E5756
#0E0F0F
#E5E0DA
#CF63FF
#564733
#140E05
#050505
#373737
#CF0070
#FDFDFD
#050505
#373737
#3D5AFE
#FFFFFF
#FDFDFD
#737373
#1800A7
#050505
#0E0E14
#4A4E6A
#C8CCE0
#FF2BD6
#040404
#313131
#E20C20
#E2E2E2
#111111
#424242
#E444BE
#FAFAFA
#DFDEE3
#C8C1D7
#6303CC
#0A0717
#0B0F0E
#3A4642
#BEF62F
#F3FFE0
#000000
#3A3A3A
#D4AF37
#F2F2F2
#0B0F14
#3C4552
#2EE6A6
#E6EDF3
#06141B
#314C5A
#1FA2B8
#CDE9EF
#14101F
#4D4365
#8E6BFF
#EEE9FF
#1A1A1D
#4C4C54
#E8788A
#F4F4F6
#0D1A14
#385645
#6DBF8A
#E8F3EC
#111318
#454A54
#F4A7B9
#FBFBFC
#0F1419
#3E4C59
#D9B99B
#F3EFE9
#18191A
#4F5052
#B8F53F
#F7F7F5
#141210
#4D4742
#C97B3A
#F2EAE2
#0B0A12
#393751
#A78BFA
#ECE9FE