Najbliższy nazwany kolor · #D0906D
#D0906D
Najbliższy nazwany kolor: Baker’s Dream
#D0906D (rgb(208 144 109), hsl(21 51% 62%), oklch(0.709 0.092 49.4)) jest najbliższy nazwanemu kolorowi Baker’s Dream. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#D0906D
oklch(0.709 0.092 49.4)
Konwersje koloru
- HEX
- #d0906d
- RGB
- rgb(208 144 109)
- HSL
- hsl(21 51% 62%)
- HWB
- hwb(21 43% 18%)
- OKLCH
- oklch(0.709 0.092 49.4)
- OKLab
- oklab(0.709 0.06 0.07)
- CIE Lab
- lab(65.71 22.03 28.84)
- LCH
- lch(65.71 36.29 52.6)
- CMYK
- cmyk(0% 31% 48% 18%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D59B7B
- DAA68A
- E0B198
- E4BCA7
- E9C7B5
- EED2C4
- F2DDD2
- F7E9E1
- FBF4F0
Odcienie ciemniejsze
- B57D5E
- 9A6A4F
- 805741
- 674533
- 4F3426
- 392419
- 23150D
- 100704
- 020101
Tony
- C88F6F
- C08D72
- B88C74
- B08A76
- A88978
- A0877A
- 98857B
- 90847D
- 88827F
Harmonie kolorów
Komplementarna +180°
- D0906D
Baker’s Dream
- 5FACCF
≈ Blue Topaz
Analogowa -30° +30°
- D0906D
Baker’s Dream
- D48A8A
≈ Pink Slip
- C09B5C
≈ Gold Spell
Triada +120° +240°
- D0906D
Baker’s Dream
- 61B498
≈ Keppel
- 9F98D7
≈ Gorgeous Hydrangea
Komplementarna rozszczepiona +150° +210°
- D0906D
Baker’s Dream
- 50B3B7
≈ Crystalsong Blue
- 7FA2DB
≈ Blue Cue
Tetrada +90° +180° +270°
- D0906D
Baker’s Dream
- 83AF78
≈ Sage
- 5FACCF
≈ Blue Topaz
- BA8FC5
≈ Lavender Blaze
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.66:1 · APCA Lc 52
Ag
AAANa czerni
WCAG 7.89:1 · APCA Lc 50
Najlepszy kolor tekstu: #000000
WCAG 7.89:1 (AAA) · APCA Lc 50
Contrast pairs
Fragmenty kodu
CSS
:root {
--baker-s-dream: #d0906d;
--baker-s-dream-rgb: 208 144 109;
--baker-s-dream-oklch: oklch(0.709 0.092 49.4);
}
.element {
color: var(--baker-s-dream);
background-color: hsl(21 51% 62%);
border-color: oklch(0.709 0.092 49.4);
}Tailwind CSS v4
@theme {
--color-baker-s-dream: #d0906d;
--color-baker-s-dream-50: #ffeede;
--color-baker-s-dream-100: #ffe0cd;
--color-baker-s-dream-200: #f5cab1;
--color-baker-s-dream-300: #deab8d;
--color-baker-s-dream-400: #cb8e6d;
--color-baker-s-dream-500: #b7734d;
--color-baker-s-dream-600: #9b6242;
--color-baker-s-dream-700: #7c4e34;
--color-baker-s-dream-800: #5c3826;
--color-baker-s-dream-900: #412619;
--color-baker-s-dream-950: #29150a;
}SCSS
$baker-s-dream: #d0906d;
$baker-s-dream-rgb: 208, 144, 109;
$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);
}