Sea Glass
Farm supplies · Score 86 ·Excellent · Added 2026-10-27 · Updated 2026-10-29
The lead color is deep, so use it for surfaces and emphasis rather than fine text. Inside a mini app it holds up when the theme color drives pill buttons and the price and badge colors stay one step apart.
Sea Glass is a 10-role Mini App palette: theme #1a9589 on a #f9fbfb canvas. Body text reaches 13.76:1 (WCAG AAA), leaving enough headroom for long reading sessions; the primary sits at 3.54:1 against the canvas, enough for large text and control borders, not for body copy.
10 color roles
theme#1a9589rgb(26, 149, 137)hsl(174.1, 70.3%, 34.3%)btn#1a9589rgb(26, 149, 137)hsl(174.1, 70.3%, 34.3%)btnDisabled#78dad0rgb(120, 218, 208)hsl(173.9, 57%, 66.3%)bg#f9fbfbrgb(249, 251, 251)hsl(180, 20%, 98%)card#f3f7f7rgb(243, 247, 247)hsl(180, 20%, 96.1%)textMain#1f2d2crgb(31, 45, 44)hsl(175.7, 18.4%, 14.9%)textSub#608581rgb(96, 133, 129)hsl(173.5, 16.2%, 44.9%)divider#e1eae9rgb(225, 234, 233)hsl(173.3, 17.6%, 90%)price#cc3b1ergb(204, 59, 30)hsl(10, 74.4%, 45.9%)tag#306c93rgb(48, 108, 147)hsl(203.6, 50.8%, 38.2%)Editorial review · Mini App
Measured 3.7:1, enough for large or bold text only. Do not put body copy on it.
Delta E 373, clearly separated. The hierarchy reads without effort.
Saturation 70%, loud. Good for emphasis; spread across a large area it overpowers the content.
Lightness 34%, deep. Solid on light surfaces; on a dark interface it sinks into the background.
How this palette is put together
Six readings computed from these exact color values. None of them would hold for another palette.
- Primary hue rangeAt hue 174° and 70% saturation, this is a blue primary, the safest choice and the most crowded one. Tools, finance and enterprise services default to it. The safety comes from how rarely it is misread, and that is also the problem: it is hard to remember. 6 palettes sit in the same range.
- Lightness distributionThe ten roles show a lightness standard deviation of 27.9 around a mean of 56%: layered without being theatrical. The background recedes, cards lift, text holds, and all of it survives a switch to grayscale.
- Background temperatureAt 20% saturation and hue 180°, #F9FBFB is a tinted ground rather than a gray one. It brings its own mood and fixes the key of the whole palette, so the primary can only be chosen inside that key. Dark text on it needs its contrast measured again instead of borrowing the usual neutral-background assumptions.
- Primary vs accent3.54:1 for the theme against 4.80:1 for the price, 1.4× apart. Rank is established without being severe: the accent stands out without overtaking. Most interfaces are steadiest here, with two usable visual weights on offer.
- Text hierarchyText main at 13.76:1 holds up, but secondary text sits at 3.91:1, below 4.5:1. That layer cannot carry small type: timestamps and helper text need to grow or switch to the main text color.
How to use it
The lead color sits at 34% lightness and 70% saturation. This palette's lead color is deep and carries weight, which suits interfaces that need to feel professional and steady, and it holds a headline up. Saturation is moderate, present without being loud, the easiest band to live with in a day-to-day interface.
What it looks like in a real interface
Accessibility contrast check
| Foreground / background | Ratio | Body text | Large text |
|---|---|---|---|
| Body text / page background | 13.76:1 | AAA | AAA |
| Body text / card background | 13.24:1 | AAA | AAA |
| Brand color / page background | 3.54:1 | AA | AA |
Verify this pair in the checker →Compare with other palettes →Site-wide accessibility report →
More palettes on this platform
Where this one sits in the library
The numbers below come from measured color distances against the other 35 palettes on this platform (mean over ten roles). They would not hold in a different library.
- Almost the same set as Cucumber Leaf, mean Delta E 39, only the primary steps apart.
- Furthest from Fresh Orange at Delta E 169; put the two side by side and they pull in opposite directions.
- Primary saturation 70 percent, rank 12 of 35 on this platform, on the saturated side.
Export to your project
Eight formats, ready to paste: four for the web, plus one each for Android, iOS, Flutter and mini programs. Or fetch them by URL from your tooling or AI agent.
:root {
--color-theme: #1a9589; /* Theme */
--color-btn: #1a9589; /* Button */
--color-btnDisabled: #78dad0; /* Button disabled */
--color-bg: #f9fbfb; /* Page background */
--color-card: #f3f7f7; /* Card */
--color-textMain: #1f2d2c; /* Text main */
--color-textSub: #608581; /* Text sub */
--color-divider: #e1eae9; /* Divider */
--color-price: #cc3b1e; /* Price */
--color-tag: #306c93; /* Tag */
}