Palette · 10 colors · Lc 8.6
Glassmith Ribbon palette
Glassmith Ribbon: a 10-color palette (Blue, Cold, 10 Colors). HEX, RGB, HSL and OKLCH for #DDF4FA, #9ED9DF, #54D0CB, #00BAC2, #0099B3, #007CAA, #006697, #004975, #00314A, #001C25, WCAG contrast on white and black, plus CSS variables, Tailwind and JSON export.
bg
#DDF4FA
surface
#9ED9DF
muted
#54D0CB
primary
#00BAC2
secondary
#0099B3
accent
#007CAA
highlight
#006697
border
#004975
focus
#00314A
text
#001C25
Colors in Glassmith Ribbon: HEX, RGB, HSL & OKLCH
- #DDF4FA color page →
bg
#DDF4FA
- RGB
- rgb(221 244 250)
- HSL
- hsl(192 74% 92%)
- OKLCH
- oklch(0.952 0.025 215.1)
WCAG contrast: on white 1.14:1 (Fail) · on black 18.39:1 (AAA)
- #9ED9DF color page →
surface
#9ED9DF
- RGB
- rgb(158 217 223)
- HSL
- hsl(186 50% 75%)
- OKLCH
- oklch(0.847 0.061 204)
WCAG contrast: on white 1.56:1 (Fail) · on black 13.44:1 (AAA)
- #54D0CB color page →
muted
#54D0CB
- RGB
- rgb(84 208 203)
- HSL
- hsl(178 57% 57%)
- OKLCH
- oklch(0.787 0.109 191.5)
WCAG contrast: on white 1.86:1 (Fail) · on black 11.26:1 (AAA)
- #00BAC2 color page →
primary
#00BAC2
- RGB
- rgb(0 186 194)
- HSL
- hsl(182 100% 38%)
- OKLCH
- oklch(0.717 0.122 200.3)
WCAG contrast: on white 2.38:1 (Fail) · on black 8.80:1 (AAA)
- #0099B3 color page →
secondary
#0099B3
- RGB
- rgb(0 153 179)
- HSL
- hsl(189 100% 35%)
- OKLCH
- oklch(0.629 0.111 215.4)
WCAG contrast: on white 3.38:1 (Fail) · on black 6.20:1 (AA)
- #007CAA color page →
accent
#007CAA
- RGB
- rgb(0 124 170)
- HSL
- hsl(196 100% 33%)
- OKLCH
- oklch(0.552 0.115 233.4)
WCAG contrast: on white 4.70:1 (AA) · on black 4.46:1 (Fail)
- #006697 color page →
highlight
#006697
- RGB
- rgb(0 102 151)
- HSL
- hsl(199 100% 30%)
- OKLCH
- oklch(0.486 0.111 239.7)
WCAG contrast: on white 6.27:1 (AA) · on black 3.34:1 (Fail)
- #004975 color page →
border
#004975
- RGB
- rgb(0 73 117)
- HSL
- hsl(203 100% 23%)
- OKLCH
- oklch(0.391 0.097 244.3)
WCAG contrast: on white 9.50:1 (AAA) · on black 2.20:1 (Fail)
- #00314A color page →
focus
#00314A
- RGB
- rgb(0 49 74)
- HSL
- hsl(200 100% 15%)
- OKLCH
- oklch(0.297 0.066 238)
WCAG contrast: on white 13.65:1 (AAA) · on black 1.53:1 (Fail)
- #001C25 color page →
text
#001C25
- RGB
- rgb(0 28 37)
- HSL
- hsl(195 100% 7%)
- OKLCH
- oklch(0.21 0.039 222.2)
WCAG contrast: on white 17.60:1 (AAA) · on black 1.19:1 (Fail)
Export Glassmith Ribbon: CSS variables, Tailwind & JSON
CSS variables
:root {
--bg: #ddf4fa;
--surface: #9ed9df;
--muted: #54d0cb;
--primary: #00bac2;
--secondary: #0099b3;
--accent: #007caa;
--highlight: #006697;
--border: #004975;
--focus: #00314a;
--text: #001c25;
}Tailwind CSS v4 @theme
@theme {
--color-bg: #ddf4fa;
--color-surface: #9ed9df;
--color-muted: #54d0cb;
--color-primary: #00bac2;
--color-secondary: #0099b3;
--color-accent: #007caa;
--color-highlight: #006697;
--color-border: #004975;
--color-focus: #00314a;
--color-text: #001c25;
}JSON (DTCG tokens)
{
"glassmith-ribbon-nb": {
"bg": {
"$type": "color",
"$value": "#ddf4fa"
},
"surface": {
"$type": "color",
"$value": "#9ed9df"
},
"muted": {
"$type": "color",
"$value": "#54d0cb"
},
"primary": {
"$type": "color",
"$value": "#00bac2"
},
"secondary": {
"$type": "color",
"$value": "#0099b3"
},
"accent": {
"$type": "color",
"$value": "#007caa"
},
"highlight": {
"$type": "color",
"$value": "#006697"
},
"border": {
"$type": "color",
"$value": "#004975"
},
"focus": {
"$type": "color",
"$value": "#00314a"
},
"text": {
"$type": "color",
"$value": "#001c25"
}
}
}About this palette
Glassmith Ribbon is a 10-color OKLCH-ready palette tagged blue, cold, 10 colors. Hex values: #DDF4FA, #9ED9DF, #54D0CB, #00BAC2, #0099B3, #007CAA, #006697, #004975, #00314A, #001C25. APCA contrast score Lc 8.6. 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 Glassmith Ribbon by OKLab color distance.