最も近い色名 · #D29A7B
#D29A7B
最も近い色名: Baker’s Dream
#D29A7B（rgb(210 154 123)、hsl(21 49% 65%)、oklch(0.732 0.08 50)）に最も近い色名はBaker’s Dreamです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#D29A7B
oklch(0.732 0.08 50)
カラー変換
- HEX
- #d29a7b
- RGB
- rgb(210 154 123)
- HSL
- hsl(21 49% 65%)
- HWB
- hwb(21 48% 18%)
- OKLCH
- oklch(0.732 0.08 50)
- OKLab
- oklab(0.732 0.051 0.061)
- CIE Lab
- lab(68.54 18.74 24.96)
- LCH
- lch(68.54 31.21 53.1)
- CMYK
- cmyk(0% 27% 41% 18%)
ティント · シェード · トーン
ティント
- D7A488
- DCAE95
- E1B8A2
- E5C2AF
- EACCBC
- EED6C9
- F3E0D7
- F7EAE4
- FBF5F1
シェード
- B6856A
- 9B715A
- 815E4A
- 684B3A
- 50392C
- 39271E
- 241710
- 100905
- 020101
トーン
- CA987C
- C2957D
- B9937D
- B1907E
- A98D7E
- A18B7F
- 99887F
- 918580
- 888380
カラーハーモニー
補色 +180°
- D29A7B
Baker’s Dream
- 72B2D1
≈ Aspara
類似色 -30° +30°
- D29A7B
Baker’s Dream
- D69494
≈ Keel Joy
- C3A36E
≈ Hashibami Brown
トライアド +120° +240°
- D29A7B
Baker’s Dream
- 73B9A1
≈ Arboretum
- A7A0D8
≈ Simply Violet
スプリットコンプリメンタリー +150° +210°
- D29A7B
Baker’s Dream
- 66B8BC
≈ Fresh Soft Blue
- 8BAADB
≈ Birdie Num Num
テトラード +90° +180° +270°
- D29A7B
Baker’s Dream
- 8EB585
≈ Aniseed Leaf Green
- 72B2D1
≈ Aspara
- BF98C8
≈ Amethyst Show
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.42:1 · APCA Lc 48
Ag
AAA黒の上
WCAG 8.64:1 · APCA Lc 54
最適な文字色: #000000
WCAG 8.64:1 (AAA) · APCA Lc 54
Contrast pairs
コードスニペット
CSS
:root {
--baker-s-dream: #d29a7b;
--baker-s-dream-rgb: 210 154 123;
--baker-s-dream-oklch: oklch(0.732 0.08 50);
}
.element {
color: var(--baker-s-dream);
background-color: hsl(21 49% 65%);
border-color: oklch(0.732 0.08 50);
}Tailwind CSS v4
@theme {
--color-baker-s-dream: #d29a7b;
--color-baker-s-dream-50: #ffefe1;
--color-baker-s-dream-100: #ffe1d0;
--color-baker-s-dream-200: #f1cbb6;
--color-baker-s-dream-300: #d9ad92;
--color-baker-s-dream-400: #c69174;
--color-baker-s-dream-500: #b17655;
--color-baker-s-dream-600: #966448;
--color-baker-s-dream-700: #78503a;
--color-baker-s-dream-800: #593a2a;
--color-baker-s-dream-900: #3e281c;
--color-baker-s-dream-950: #27160c;
}SCSS
$baker-s-dream: #d29a7b;
$baker-s-dream-rgb: 210, 154, 123;
$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);
}