#03256C
#2541B2
#1768AC
#06BEE1
#1F2041Space
#5A4F83Dusk
#BAD2FFPeriwinkle
#119DA4Cadet
Cadet & Dusk Story is a split color palette tagged dark, cold, blue. A split scheme: Space plays against Cadet across roughly 70° of hue. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is cool.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Space | #1F2041 | rgb(31, 32, 65) | hsl(238, 35%, 19%) | oklch(26.1% 0.061 280) | |
| Dusk | #5A4F83 | rgb(90, 79, 131) | hsl(253, 25%, 41%) | oklch(46.1% 0.084 293) | |
| Periwinkle | #BAD2FF | rgb(186, 210, 255) | hsl(219, 100%, 86%) | oklch(86.1% 0.068 263) | |
| Cadet | #119DA4 | rgb(17, 157, 164) | hsl(183, 81%, 35%) | oklch(63.4% 0.105 201) |
Why it works and how to use it
With 4 chromatic colors, Cadet takes the lead while the rest support. Lightness runs from 19% to 86%. Well suited to websites, presentations and branding.
- Background: Periwinkle (#BAD2FF) is the lightest color, so it belongs on large surfaces.
- Text: Space (#1F2041) on #BAD2FF gives 10.25:1, passing WCAG AAA.
- Primary: Cadet (#119DA4) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Dusk (#5A4F83) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Space on Periwinkle at 10.25:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Cadet & Dusk Story
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
#1F2041
#5A4F83
#BAD2FF
#119DA4
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#1F2041 on #BAD2FF | Aa | 10.25:1 | AAA |
#5A4F83 on #BAD2FF | Aa | 4.77:1 | AA |
#1F2041 on #119DA4 | Aa | 4.76:1 | AA |
#5A4F83 on #119DA4 | Aa | 2.22:1 | Fail |
#1F2041 on #5A4F83 | Aa | 2.15:1 | Fail |
#BAD2FF on #119DA4 | Aa | 2.15:1 | Fail |
Similar palettes 24 more in this mood
#0B132B
#3B487A
#5C7BA8
#6FFFE9
#00304E
#00538D
#006F94
#00C2C8
#002A32
#006A7E
#009AC1
#A7DACC
#010028
#006398
#009DBD
#77C7D6
#010215
#283363
#405E89
#4BE0CB
#0B2447
#3B5C9E
#6E86D6
#A5D7E8
#03071E
#0B525B
#1B998B
#C2F970
#1A1B26
#4B5273
#7AA2F7
#BB9AF7
#0A1024
#3A456B
#5C7CFA
#DDE3FF
#2D00F7
#00F5D4
#F9F871
#111111
#10002B
#7B2CBF
#E0AAFF
#00F5D4
#E0EFFF
#6EB2FC
#1E5B9A
#002344
#2F1904
#006064
#A44A00
#5A99FF
#121016
#54149C
#693B79
#5B9FFF
#00191D
#005664
#36888C
#D1F290
#D8BFFF
#B37BF7
#7B31BA
#240042
#003439
#006857
#55709F
#008FC2
#00273E
#006975
#A6BDD0
#E9E9E9
#0C2654
#3C59A3
#6B7FD5
#F3E8F3
#00332D
#006D63
#00C3B7
#00F2D5
#06141B
#315B70
#00A3BA
#9EC6CE
#05070B
#00576A
#576E84
#00B579
#00F7DF
#FFEA80
#46458C
#141235