Nazwany kolor · #87BEA3
Baby Cake
Baby Cake to #87BEA3: rgb(135 190 163), hsl(151 30% 64%), oklch(0.756 0.07 162.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Baby Cake color name →
#87BEA3
oklch(0.756 0.07 162.9)
Konwersje koloru
- HEX
- #87bea3
- RGB
- rgb(135 190 163)
- HSL
- hsl(151 30% 64%)
- HWB
- hwb(151 53% 25%)
- OKLCH
- oklch(0.756 0.07 162.9)
- OKLab
- oklab(0.756 -0.066 0.02)
- CIE Lab
- lab(72.58 -22.99 7.65)
- LCH
- lch(72.58 24.23 161.6)
- CMYK
- cmyk(29% 0% 14% 25%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 93C4AC
- 9FCBB5
- ABD1BE
- B7D8C7
- C3DED0
- CFE5D9
- DBEBE3
- E7F2EC
- F3F8F6
Odcienie ciemniejsze
- 75A58D
- 638C78
- 517563
- 415E4F
- 31483C
- 21332A
- 131F19
- 060D0A
- 010201
Tony
- 87B89F
- 87B19C
- 86AB98
- 86A595
- 859F91
- 84988E
- 83928A
- 828C87
- 818683
Harmonie kolorów
Komplementarna +180°
- 87BEA3
Baby Cake
- D09FBB
≈ Quilted Heart
Analogowa -30° +30°
- 87BEA3
Baby Cake
- 9FBA8C
≈ Glendale
- 79BEBC
≈ Gentle Wave
Triada +120° +240°
- 87BEA3
Baby Cake
- A9ABDB
≈ Childish Wonder
- D6A28D
≈ Shetland Pony
Komplementarna rozszczepiona +150° +210°
- 87BEA3
Baby Cake
- BFA3D0
≈ Lucius Lilac
- D89EA3
≈ Rosewood Apricot
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.11:1 · APCA Lc 41
Ag
AAANa czerni
WCAG 9.92:1 · APCA Lc 61
Najlepszy kolor tekstu: #000000
WCAG 9.92:1 (AAA) · APCA Lc 61
Contrast pairs
Fragmenty kodu
CSS
:root {
--baby-cake: #87bea3;
--baby-cake-rgb: 135 190 163;
--baby-cake-oklch: oklch(0.756 0.07 162.9);
}
.element {
color: var(--baby-cake);
background-color: hsl(151 30% 64%);
border-color: oklch(0.756 0.07 162.9);
}Tailwind CSS v4
@theme {
--color-baby-cake: #87bea3;
--color-baby-cake-50: #e4fcf0;
--color-baby-cake-100: #d4f0e2;
--color-baby-cake-200: #badecd;
--color-baby-cake-300: #97c3ae;
--color-baby-cake-400: #78ac93;
--color-baby-cake-500: #599579;
--color-baby-cake-600: #4c7e66;
--color-baby-cake-700: #3c6552;
--color-baby-cake-800: #2c4a3a;
--color-baby-cake-900: #1d3328;
--color-baby-cake-950: #0d1f16;
}SCSS
$baby-cake: #87bea3;
$baby-cake-rgb: 135, 190, 163;
$baby-cake-light: mix(#fff, $baby-cake, 20%);
$baby-cake-dark: mix(#000, $baby-cake, 20%);
.element {
color: $baby-cake;
box-shadow: 0 0 0 2px rgba($baby-cake, 0.35);
}