色名 · #D2A88F
Vienna Beige
Vienna Beigeは#D2A88F：rgb(210 168 143)、hsl(22 43% 69%)、oklch(0.763 0.061 52.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Vienna Beige color name →
#D2A88F
oklch(0.763 0.061 52.3)
カラー変換
- HEX
- #d2a88f
- RGB
- rgb(210 168 143)
- HSL
- hsl(22 43% 69%)
- HWB
- hwb(22 56% 18%)
- OKLCH
- oklch(0.763 0.061 52.3)
- OKLab
- oklab(0.763 0.037 0.048)
- CIE Lab
- lab(72.28 13.3 19.12)
- LCH
- lch(72.28 23.29 55.2)
- CMYK
- cmyk(0% 20% 32% 18%)
ティント · シェード · トーン
ティント
- D7B19A
- DBB9A5
- E0C2B0
- E5CABB
- E9D3C6
- EEDCD1
- F2E5DD
- F6EDE8
- FBF6F3
シェード
- B6927C
- 9B7C69
- 816757
- 685245
- 503F34
- 392C24
- 241A15
- 100A07
- 020101
トーン
- CAA48E
- C1A08C
- B99C8B
- B19889
- A99488
- A09086
- 988C85
- 908883
- 888482
カラーハーモニー
補色 +180°
- D2A88F
Vienna Beige
- 8CBAD2
≈ Bonnie Blue
類似色 -30° +30°
- D2A88F
Vienna Beige
- D6A4A1
≈ La Vie en Rose
- C5AF86
≈ Green Gold
トライアド +120° +240°
- D2A88F
Vienna Beige
- 8BBFAE
≈ Seaborn
- B2ACD6
≈ Purple Hibiscus
スプリットコンプリメンタリー +150° +210°
- D2A88F
Vienna Beige
- 84BEC3
≈ Riverbed
- 9EB3D9
≈ Myrtle Flower
テトラード +90° +180° +270°
- D2A88F
Vienna Beige
- 9DBC99
≈ Quiet Green
- 8CBAD2
≈ Bonnie Blue
- C5A6C9
≈ Tea Towel
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.15:1 · APCA Lc 42
Ag
AAA黒の上
WCAG 9.73:1 · APCA Lc 60
最適な文字色: #000000
WCAG 9.73:1 (AAA) · APCA Lc 60
Contrast pairs
コードスニペット
CSS
:root {
--vienna-beige: #d2a88f;
--vienna-beige-rgb: 210 168 143;
--vienna-beige-oklch: oklch(0.763 0.061 52.3);
}
.element {
color: var(--vienna-beige);
background-color: hsl(22 43% 69%);
border-color: oklch(0.763 0.061 52.3);
}Tailwind CSS v4
@theme {
--color-vienna-beige: #d2a88f;
--color-vienna-beige-50: #fff1e5;
--color-vienna-beige-100: #f9e3d5;
--color-vienna-beige-200: #eacebc;
--color-vienna-beige-300: #d1b09b;
--color-vienna-beige-400: #bc957e;
--color-vienna-beige-500: #a77b61;
--color-vienna-beige-600: #8d6852;
--color-vienna-beige-700: #715341;
--color-vienna-beige-800: #543c2f;
--color-vienna-beige-900: #3a2920;
--color-vienna-beige-950: #241710;
}SCSS
$vienna-beige: #d2a88f;
$vienna-beige-rgb: 210, 168, 143;
$vienna-beige-light: mix(#fff, $vienna-beige, 20%);
$vienna-beige-dark: mix(#000, $vienna-beige, 20%);
.element {
color: $vienna-beige;
box-shadow: 0 0 0 2px rgba($vienna-beige, 0.35);
}