Palette · 9 colors · Lc 9.3
True Twinkle Night Horizon palette
True Twinkle Night Horizon: a 9-color palette (Trending, Pink, Monochromatic, 9 Colors). HEX, RGB, HSL and OKLCH for #06070F, #161B36, #333863, #4B5080, #6A70AE, #8D92C5, #A5AADD, #C8CBE5, #F0F2FF, WCAG contrast on white and black, plus CSS variables, Tailwind and JSON export.
- Trending
- Pink
- Monochromatic
- 9 Colors
bg
#06070F
surface
#161B36
muted
#333863
primary
#4B5080
secondary
#6A70AE
accent
#8D92C5
highlight
#A5AADD
border
#C8CBE5
text
#F0F2FF
Colors in True Twinkle Night Horizon: HEX, RGB, HSL & OKLCH
- #06070F color page →
bg
#06070F
- RGB
- rgb(6 7 15)
- HSL
- hsl(233 43% 4%)
- OKLCH
- oklch(0.132 0.019 276.8)
WCAG contrast: on white 20.09:1 (AAA) · on black 1.04:1 (Fail)
- #161B36 color page →
surface
#161B36
- RGB
- rgb(22 27 54)
- HSL
- hsl(231 42% 15%)
- OKLCH
- oklch(0.233 0.052 273.7)
WCAG contrast: on white 16.87:1 (AAA) · on black 1.24:1 (Fail)
- #333863 color page →
muted
#333863
- RGB
- rgb(51 56 99)
- HSL
- hsl(234 32% 29%)
- OKLCH
- oklch(0.358 0.074 276.9)
WCAG contrast: on white 11.13:1 (AAA) · on black 1.88:1 (Fail)
- #4B5080 color page →
primary
#4B5080
- RGB
- rgb(75 80 128)
- HSL
- hsl(234 26% 40%)
- OKLCH
- oklch(0.449 0.079 278.2)
WCAG contrast: on white 7.61:1 (AAA) · on black 2.75:1 (Fail)
- #6A70AE color page →
secondary
#6A70AE
- RGB
- rgb(106 112 174)
- HSL
- hsl(235 30% 55%)
- OKLCH
- oklch(0.567 0.096 278.7)
WCAG contrast: on white 4.62:1 (AA) · on black 4.54:1 (AA)
- #8D92C5 color page →
accent
#8D92C5
- RGB
- rgb(141 146 197)
- HSL
- hsl(235 33% 66%)
- OKLCH
- oklch(0.675 0.076 279.8)
WCAG contrast: on white 2.97:1 (Fail) · on black 7.05:1 (AAA)
- #A5AADD color page →
highlight
#A5AADD
- RGB
- rgb(165 170 221)
- HSL
- hsl(235 45% 76%)
- OKLCH
- oklch(0.752 0.073 280.1)
WCAG contrast: on white 2.23:1 (Fail) · on black 9.39:1 (AAA)
- #C8CBE5 color page →
border
#C8CBE5
- RGB
- rgb(200 203 229)
- HSL
- hsl(234 36% 84%)
- OKLCH
- oklch(0.848 0.036 280.4)
WCAG contrast: on white 1.59:1 (Fail) · on black 13.12:1 (AAA)
- #F0F2FF color page →
text
#F0F2FF
- RGB
- rgb(240 242 255)
- HSL
- hsl(232 100% 97%)
- OKLCH
- oklch(0.963 0.018 279.1)
WCAG contrast: on white 1.11:1 (Fail) · on black 18.84:1 (AAA)
Export True Twinkle Night Horizon: CSS variables, Tailwind & JSON
CSS variables
:root {
--bg: #06070f;
--surface: #161b36;
--muted: #333863;
--primary: #4b5080;
--secondary: #6a70ae;
--accent: #8d92c5;
--highlight: #a5aadd;
--border: #c8cbe5;
--text: #f0f2ff;
}Tailwind CSS v4 @theme
@theme {
--color-bg: #06070f;
--color-surface: #161b36;
--color-muted: #333863;
--color-primary: #4b5080;
--color-secondary: #6a70ae;
--color-accent: #8d92c5;
--color-highlight: #a5aadd;
--color-border: #c8cbe5;
--color-text: #f0f2ff;
}JSON (DTCG tokens)
{
"true-twinkle-night-horizon-7e1": {
"bg": {
"$type": "color",
"$value": "#06070f"
},
"surface": {
"$type": "color",
"$value": "#161b36"
},
"muted": {
"$type": "color",
"$value": "#333863"
},
"primary": {
"$type": "color",
"$value": "#4b5080"
},
"secondary": {
"$type": "color",
"$value": "#6a70ae"
},
"accent": {
"$type": "color",
"$value": "#8d92c5"
},
"highlight": {
"$type": "color",
"$value": "#a5aadd"
},
"border": {
"$type": "color",
"$value": "#c8cbe5"
},
"text": {
"$type": "color",
"$value": "#f0f2ff"
}
}
}About this palette
True Twinkle Night Horizon is a 9-color OKLCH-ready palette tagged trending, pink, monochromatic, 9 colors. Hex values: #06070F, #161B36, #333863, #4B5080, #6A70AE, #8D92C5, #A5AADD, #C8CBE5, #F0F2FF. APCA contrast score Lc 9.3. Open it in Colorise Pro Studio to lock roles and regenerate harmonies.
Related palettes
Shared tags, similar size and contrast.
Palettes with similar colors
Closest to True Twinkle Night Horizon by OKLab color distance.