Nazwany kolor · #C3C3B8
Baby Barn Owl
Baby Barn Owl to #C3C3B8: rgb(195 195 184), hsl(60 8% 74%), oklch(0.814 0.015 106.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Baby Barn Owl color name →
#C3C3B8
oklch(0.814 0.015 106.7)
Konwersje koloru
- HEX
- #c3c3b8
- RGB
- rgb(195 195 184)
- HSL
- hsl(60 8% 74%)
- HWB
- hwb(60 72% 24%)
- OKLCH
- oklch(0.814 0.015 106.7)
- OKLab
- oklab(0.814 -0.004 0.014)
- CIE Lab
- lab(78.56 -1.47 5.55)
- LCH
- lch(78.56 5.74 104.8)
- CMYK
- cmyk(0% 0% 6% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C9C9BF
- CFCFC6
- D5D5CD
- DBDBD4
- E1E1DB
- E7E7E2
- EDEDE9
- F3F3F0
- F9F9F8
Odcienie ciemniejsze
- A9A9A0
- 909088
- 787871
- 60605B
- 4A4A45
- 343431
- 20201E
- 0E0E0C
- 020202
Tony
- BCBCB2
- B5B5AD
- AEAEA7
- A8A8A1
- A1A19C
- 9A9A96
- 949490
- 8D8D8B
- 868685
Harmonie kolorów
Komplementarna +180°
- C3C3B8
Baby Barn Owl
- C1C1CC
≈ Pensive
Analogowa -30° +30°
- C3C3B8
Baby Barn Owl
- C8C1B8
≈ Gettysburg Grey
- BEC5BB
≈ Riverdale
Triada +120° +240°
- C3C3B8
Baby Barn Owl
- B9C4CA
≈ Yorkshire Cloud
- CABEC4
≈ Glass Bead
Komplementarna rozszczepiona +150° +210°
- C3C3B8
Baby Barn Owl
- BCC3CC
≈ Yorkshire Cloud
- C6BFC9
≈ Grape Mist
Tetrada +90° +180° +270°
- C3C3B8
Baby Barn Owl
- B8C5C5
≈ Trade Winds
- C1C1CC
≈ Pensive
- CCBEBF
≈ Nantucket Mist
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.77:1 · APCA Lc 33
Ag
AAANa czerni
WCAG 11.81:1 · APCA Lc 70
Najlepszy kolor tekstu: #000000
WCAG 11.81:1 (AAA) · APCA Lc 70
Contrast pairs
Fragmenty kodu
CSS
:root {
--baby-barn-owl: #c3c3b8;
--baby-barn-owl-rgb: 195 195 184;
--baby-barn-owl-oklch: oklch(0.814 0.015 106.7);
}
.element {
color: var(--baby-barn-owl);
background-color: hsl(60 8% 74%);
border-color: oklch(0.814 0.015 106.7);
}Tailwind CSS v4
@theme {
--color-baby-barn-owl: #c3c3b8;
--color-baby-barn-owl-50: #f5f5f1;
--color-baby-barn-owl-100: #e8e8e3;
--color-baby-barn-owl-200: #d4d5ce;
--color-baby-barn-owl-300: #b8b8af;
--color-baby-barn-owl-400: #9f9f95;
--color-baby-barn-owl-500: #87877c;
--color-baby-barn-owl-600: #727269;
--color-baby-barn-owl-700: #5b5b54;
--color-baby-barn-owl-800: #43433d;
--color-baby-barn-owl-900: #2e2e2a;
--color-baby-barn-owl-950: #1b1b17;
}SCSS
$baby-barn-owl: #c3c3b8;
$baby-barn-owl-rgb: 195, 195, 184;
$baby-barn-owl-light: mix(#fff, $baby-barn-owl, 20%);
$baby-barn-owl-dark: mix(#000, $baby-barn-owl, 20%);
.element {
color: $baby-barn-owl;
box-shadow: 0 0 0 2px rgba($baby-barn-owl, 0.35);
}