Couleur nommée · #91CBBF
Beach Breeze
Beach Breeze correspond à #91CBBF : rgb(145 203 191), hsl(168 36% 68%), oklch(0.799 0.062 180.4). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Teal mean? → · Beach Breeze color name →
#91CBBF
oklch(0.799 0.062 180.4)
Conversions de couleur
- HEX
- #91cbbf
- RGB
- rgb(145 203 191)
- HSL
- hsl(168 36% 68%)
- HWB
- hwb(168 57% 20%)
- OKLCH
- oklch(0.799 0.062 180.4)
- OKLab
- oklab(0.799 -0.062 0)
- CIE Lab
- lab(77.44 -21.36 -0.33)
- LCH
- lch(77.44 21.36 180.9)
- CMYK
- cmyk(29% 0% 6% 20%)
Teintes · Ombres · Tons
Teintes
- 9CD0C5
- A8D5CC
- B3DBD2
- BEE0D8
- C9E5DF
- D4EAE5
- DEEFEB
- E9F5F2
- F4FAF8
Ombres
- 7DB0A6
- 6A968D
- 587D75
- 46655E
- 354D48
- 253733
- 15221F
- 070F0D
- 010202
Tons
- 90C3B8
- 8FBCB2
- 8DB4AC
- 8CACA5
- 8AA59F
- 889D99
- 869692
- 848F8C
- 828786
Harmonies de couleurs
Complémentaire +180°
- 91CBBF
Beach Breeze
- E0ADBB
≈ Apple Infusion
Analogue -30° +30°
- 91CBBF
Beach Breeze
- A1C9A9
≈ French Market
- 8EC9D4
≈ Idyllic Isle
Triadique +120° +240°
- 91CBBF
Beach Breeze
- C3B5E0
≈ Melrose
- DCB595
≈ Crossed Fingers
Complémentaire divisée +150° +210°
- 91CBBF
Beach Breeze
- D5AFD0
≈ Lavender Knoll
- E3AFA6
≈ Pale Blush
Tétradique +90° +180° +270°
- 91CBBF
Beach Breeze
- AEBCE6
≈ French Lilac Blue
- E0ADBB
≈ Apple Infusion
- CDBC90
≈ Western Wear
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.82:1 · APCA Lc 34
Ag
AAASur noir
WCAG 11.49:1 · APCA Lc 68
Meilleure couleur de texte: #000000
WCAG 11.49:1 (AAA) · APCA Lc 68
Contrast pairs
Extraits de code
CSS
:root {
--beach-breeze: #91cbbf;
--beach-breeze-rgb: 145 203 191;
--beach-breeze-oklch: oklch(0.799 0.062 180.4);
}
.element {
color: var(--beach-breeze);
background-color: hsl(168 36% 68%);
border-color: oklch(0.799 0.062 180.4);
}Tailwind CSS v4
@theme {
--color-beach-breeze: #91cbbf;
--color-beach-breeze-50: #e3fbf6;
--color-beach-breeze-100: #d2efe9;
--color-beach-breeze-200: #b8ddd6;
--color-beach-breeze-300: #95c2ba;
--color-beach-breeze-400: #75aba0;
--color-beach-breeze-500: #549488;
--color-beach-breeze-600: #487d73;
--color-beach-breeze-700: #3a645c;
--color-beach-breeze-800: #294a42;
--color-beach-breeze-900: #1c332e;
--color-beach-breeze-950: #0c1f1b;
}SCSS
$beach-breeze: #91cbbf;
$beach-breeze-rgb: 145, 203, 191;
$beach-breeze-light: mix(#fff, $beach-breeze, 20%);
$beach-breeze-dark: mix(#000, $beach-breeze, 20%);
.element {
color: $beach-breeze;
box-shadow: 0 0 0 2px rgba($beach-breeze, 0.35);
}