Cor nomeada · #ABBED0
Rendez-Blue
Rendez-Blue é #ABBED0: rgb(171 190 208), hsl(209 28% 74%), oklch(0.793 0.033 246.8). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Rendez-Blue color name →
#ABBED0
oklch(0.793 0.033 246.8)
Conversões de cor
- HEX
- #abbed0
- RGB
- rgb(171 190 208)
- HSL
- hsl(209 28% 74%)
- HWB
- hwb(209 67% 18%)
- OKLCH
- oklch(0.793 0.033 246.8)
- OKLab
- oklab(0.793 -0.013 -0.03)
- CIE Lab
- lab(75.95 -3.9 -11.4)
- LCH
- lch(75.95 12.05 251.1)
- CMYK
- cmyk(18% 9% 0% 18%)
Tons claros · Sombras · Tons
Tons claros
- B3C4D5
- BBCBD9
- C4D1DE
- CCD8E3
- D4DEE7
- DDE5EC
- E5EBF1
- EEF2F6
- F6F8FA
Sombras
- 94A5B5
- 7E8C9A
- 687580
- 545E67
- 40484F
- 2D3339
- 1B1F23
- 0B0D10
- 010202
Tons
- A7B8C8
- A2B1C0
- 9EABB7
- 9AA5AF
- 959FA7
- 91989F
- 8D9297
- 898C8F
- 848688
Harmonias de cor
Complementar +180°
- ABBED0
Rendez-Blue
- CAB8A6
≈ Rustic Rose
Análoga -30° +30°
- ABBED0
Rendez-Blue
- A5C1C9
≈ Winter Sky
- B5BAD1
≈ Cold Winter’s Morn
Tríade +120° +240°
- ABBED0
Rendez-Blue
- CFB3B8
≈ Izmir Pink
- B6C0A9
≈ Desolace Dew
Complementar dividida +150° +210°
- ABBED0
Rendez-Blue
- CFB5AD
≈ Plymouth Notch
- C1BCA4
≈ Castle Wall
Tétrade +90° +180° +270°
- ABBED0
Rendez-Blue
- CAB4C3
≈ Cool Quiet
- CAB8A6
≈ Rustic Rose
- ABC2B3
≈ Kind Green
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.90:1 · APCA Lc 36
Ag
AAASobre preto
WCAG 11.00:1 · APCA Lc 66
Melhor cor de texto: #000000
WCAG 11.00:1 (AAA) · APCA Lc 66
Contrast pairs
Trechos de código
CSS
:root {
--rendez-blue: #abbed0;
--rendez-blue-rgb: 171 190 208;
--rendez-blue-oklch: oklch(0.793 0.033 246.8);
}
.element {
color: var(--rendez-blue);
background-color: hsl(209 28% 74%);
border-color: oklch(0.793 0.033 246.8);
}Tailwind CSS v4
@theme {
--color-rendez-blue: #abbed0;
--color-rendez-blue-50: #eef6fe;
--color-rendez-blue-100: #e0e9f3;
--color-rendez-blue-200: #cad6e2;
--color-rendez-blue-300: #abb9c8;
--color-rendez-blue-400: #8fa1b1;
--color-rendez-blue-500: #75899b;
--color-rendez-blue-600: #637483;
--color-rendez-blue-700: #4f5d69;
--color-rendez-blue-800: #39444d;
--color-rendez-blue-900: #272f36;
--color-rendez-blue-950: #151b21;
}SCSS
$rendez-blue: #abbed0;
$rendez-blue-rgb: 171, 190, 208;
$rendez-blue-light: mix(#fff, $rendez-blue, 20%);
$rendez-blue-dark: mix(#000, $rendez-blue, 20%);
.element {
color: $rendez-blue;
box-shadow: 0 0 0 2px rgba($rendez-blue, 0.35);
}