Cor nomeada · #BEDFD3
Otto Ice
Otto Ice é #BEDFD3: rgb(190 223 211), hsl(158 34% 81%), oklch(0.876 0.038 171.4). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Otto Ice color name →
#BEDFD3
oklch(0.876 0.038 171.4)
Conversões de cor
- HEX
- #bedfd3
- RGB
- rgb(190 223 211)
- HSL
- hsl(158 34% 81%)
- HWB
- hwb(158 75% 13%)
- OKLCH
- oklch(0.876 0.038 171.4)
- OKLab
- oklab(0.876 -0.038 0.006)
- CIE Lab
- lab(86.16 -13.02 2.07)
- LCH
- lch(86.16 13.18 171)
- CMYK
- cmyk(15% 0% 5% 13%)
Tons claros · Sombras · Tons
Tons claros
- C5E2D7
- CBE5DC
- D2E9E0
- D8ECE4
- DFEFE9
- E5F2ED
- ECF5F2
- F2F9F6
- F9FCFB
Sombras
- A5C2B7
- 8CA59C
- 758A82
- 5E6F69
- 485651
- 333D3A
- 1F2724
- 0D1210
- 020202
Tons
- B8D5CA
- B1CBC2
- ABC2B9
- A5B8B1
- 9FAEA9
- 99A5A0
- 929C98
- 8C9290
- 868988
Harmonias de cor
Complementar +180°
- BEDFD3
Otto Ice
- ECCCD9
≈ Donquixote Doflamingo
Análoga -30° +30°
- BEDFD3
Otto Ice
- C9DDC6
≈ Misty Afternoon
- BADEE1
≈ Basin Blue
Tríade +120° +240°
- BEDFD3
Otto Ice
- D6D2EE
≈ Air Castle
- ECD0C0
≈ Peach Blossom Red
Complementar dividida +150° +210°
- BEDFD3
Otto Ice
- E3CEE6
≈ Footie Pyjamas
- EFCDCB
≈ Kislev Pink
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.43:1 · APCA Lc 21
Ag
AAASobre preto
WCAG 14.68:1 · APCA Lc 83
Melhor cor de texto: #000000
WCAG 14.68:1 (AAA) · APCA Lc 83
Contrast pairs
Trechos de código
CSS
:root {
--otto-ice: #bedfd3;
--otto-ice-rgb: 190 223 211;
--otto-ice-oklch: oklch(0.876 0.038 171.4);
}
.element {
color: var(--otto-ice);
background-color: hsl(158 34% 81%);
border-color: oklch(0.876 0.038 171.4);
}Tailwind CSS v4
@theme {
--color-otto-ice: #bedfd3;
--color-otto-ice-50: #ebf9f4;
--color-otto-ice-100: #dcece7;
--color-otto-ice-200: #c4dad3;
--color-otto-ice-300: #a4beb6;
--color-otto-ice-400: #88a69b;
--color-otto-ice-500: #6d8f83;
--color-otto-ice-600: #5c796f;
--color-otto-ice-700: #4a6159;
--color-otto-ice-800: #354740;
--color-otto-ice-900: #24312c;
--color-otto-ice-950: #131d19;
}SCSS
$otto-ice: #bedfd3;
$otto-ice-rgb: 190, 223, 211;
$otto-ice-light: mix(#fff, $otto-ice, 20%);
$otto-ice-dark: mix(#000, $otto-ice, 20%);
.element {
color: $otto-ice;
box-shadow: 0 0 0 2px rgba($otto-ice, 0.35);
}