Najbliższy nazwany kolor · #C09273
#C09273
Najbliższy nazwany kolor: Baker’s Dream
#C09273 (rgb(192 146 115), hsl(24 38% 60%), oklch(0.696 0.071 55.2)) jest najbliższy nazwanemu kolorowi Baker’s Dream. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#C09273
oklch(0.696 0.071 55.2)
Konwersje koloru
- HEX
- #c09273
- RGB
- rgb(192 146 115)
- HSL
- hsl(24 38% 60%)
- HWB
- hwb(24 45% 25%)
- OKLCH
- oklch(0.696 0.071 55.2)
- OKLab
- oklab(0.696 0.04 0.058)
- CIE Lab
- lab(64.46 14.9 23.53)
- LCH
- lch(64.46 27.85 57.7)
- CMYK
- cmyk(0% 24% 40% 25%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C79D81
- CDA78E
- D3B29C
- DABDAA
- E0C8B8
- E6D3C6
- EDDED4
- F3E9E2
- F9F4F1
Odcienie ciemniejsze
- A77E63
- 8E6B54
- 765845
- 5F4636
- 493528
- 34251B
- 20160F
- 0E0805
- 020101
Tony
- BA9075
- B38F76
- AD8D78
- A78B79
- A0897A
- 9A887C
- 93867D
- 8D847E
- 86827F
Harmonie kolorów
Komplementarna +180°
- C09273
Baker’s Dream
- 71A5C3
≈ Wandering River
Analogowa -30° +30°
- C09273
Baker’s Dream
- C58C87
≈ Grand Sunset
- B19A6A
≈ Veranda Gold
Triada +120° +240°
- C09273
Baker’s Dream
- 6CAC9B
≈ Green Crush
- A095C5
≈ Distinct Purple
Komplementarna rozszczepiona +150° +210°
- C09273
Baker’s Dream
- 65AAB2
≈ Summer Sea
- 889DCA
≈ Caribbean Sky
Tetrada +90° +180° +270°
- C09273
Baker’s Dream
- 82A983
≈ Baby Spinach
- 71A5C3
≈ Wandering River
- B48EB5
≈ Metal Petal
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.76:1 · APCA Lc 53
Ag
AAANa czerni
WCAG 7.60:1 · APCA Lc 49
Najlepszy kolor tekstu: #000000
WCAG 7.60:1 (AAA) · APCA Lc 49
Contrast pairs
Fragmenty kodu
CSS
:root {
--baker-s-dream: #c09273;
--baker-s-dream-rgb: 192 146 115;
--baker-s-dream-oklch: oklch(0.696 0.071 55.2);
}
.element {
color: var(--baker-s-dream);
background-color: hsl(24 38% 60%);
border-color: oklch(0.696 0.071 55.2);
}Tailwind CSS v4
@theme {
--color-baker-s-dream: #c09273;
--color-baker-s-dream-50: #fff1e2;
--color-baker-s-dream-100: #fbe3d2;
--color-baker-s-dream-200: #eccdb8;
--color-baker-s-dream-300: #d4af95;
--color-baker-s-dream-400: #c09476;
--color-baker-s-dream-500: #ab7a58;
--color-baker-s-dream-600: #90674b;
--color-baker-s-dream-700: #74523c;
--color-baker-s-dream-800: #563c2b;
--color-baker-s-dream-900: #3c291d;
--color-baker-s-dream-950: #26170d;
}SCSS
$baker-s-dream: #c09273;
$baker-s-dream-rgb: 192, 146, 115;
$baker-s-dream-light: mix(#fff, $baker-s-dream, 20%);
$baker-s-dream-dark: mix(#000, $baker-s-dream, 20%);
.element {
color: $baker-s-dream;
box-shadow: 0 0 0 2px rgba($baker-s-dream, 0.35);
}