色名 · #BB9B7D
Maison de Campagne
Maison de Campagneは#BB9B7D：rgb(187 155 125)、hsl(29 31% 61%)、oklch(0.711 0.056 64.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Maison de Campagne color name →
#BB9B7D
oklch(0.711 0.056 64.9)
カラー変換
- HEX
- #bb9b7d
- RGB
- rgb(187 155 125)
- HSL
- hsl(29 31% 61%)
- HWB
- hwb(29 49% 27%)
- OKLCH
- oklch(0.711 0.056 64.9)
- OKLab
- oklab(0.711 0.024 0.051)
- CIE Lab
- lab(66.36 9.05 20.47)
- LCH
- lch(66.36 22.38 66.1)
- CMYK
- cmyk(0% 17% 33% 27%)
ティント · シェード · トーン
ティント
- C2A58A
- C9AE96
- CFB8A3
- D6C2B0
- DDCCBD
- E4D6CA
- EBE0D7
- F1EAE4
- F8F5F2
シェード
- A2866C
- 8A725B
- 735E4B
- 5C4B3B
- 46392C
- 32281E
- 1F1811
- 0D0905
- 020101
トーン
- B5987E
- AF967E
- A9937E
- A3907F
- 9D8E7F
- 978B7F
- 928880
- 8C8580
- 868380
カラーハーモニー
補色 +180°
- BB9B7D
Maison de Campagne
- 85A6C3
≈ High Tide
類似色 -30° +30°
- BB9B7D
Maison de Campagne
- C2968A
≈ Pressed Blossoms
- ADA27A
≈ Fond of Fronds
トライアド +120° +240°
- BB9B7D
Maison de Campagne
- 79AEA6
≈ Green Room
- AA99BF
≈ Ode to Purple
スプリットコンプリメンタリー +150° +210°
- BB9B7D
Maison de Campagne
- 79ABB8
≈ Snowboard
- 97A0C6
≈ Blue Heron
テトラード +90° +180° +270°
- BB9B7D
Maison de Campagne
- 86AD92
≈ Covent Garden
- 85A6C3
≈ High Tide
- B995B0
≈ Blooming Lilac
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.59:1 · APCA Lc 51
Ag
AAA黒の上
WCAG 8.09:1 · APCA Lc 51
最適な文字色: #000000
WCAG 8.09:1 (AAA) · APCA Lc 51
Contrast pairs
コードスニペット
CSS
:root {
--maison-de-campagne: #bb9b7d;
--maison-de-campagne-rgb: 187 155 125;
--maison-de-campagne-oklch: oklch(0.711 0.056 64.9);
}
.element {
color: var(--maison-de-campagne);
background-color: hsl(29 31% 61%);
border-color: oklch(0.711 0.056 64.9);
}Tailwind CSS v4
@theme {
--color-maison-de-campagne: #bb9b7d;
--color-maison-de-campagne-50: #fff2e5;
--color-maison-de-campagne-100: #f5e5d5;
--color-maison-de-campagne-200: #e5d0bb;
--color-maison-de-campagne-300: #ccb299;
--color-maison-de-campagne-400: #b6987c;
--color-maison-de-campagne-500: #a17f5e;
--color-maison-de-campagne-600: #886b50;
--color-maison-de-campagne-700: #6d5640;
--color-maison-de-campagne-800: #513e2e;
--color-maison-de-campagne-900: #382b1f;
--color-maison-de-campagne-950: #23180f;
}SCSS
$maison-de-campagne: #bb9b7d;
$maison-de-campagne-rgb: 187, 155, 125;
$maison-de-campagne-light: mix(#fff, $maison-de-campagne, 20%);
$maison-de-campagne-dark: mix(#000, $maison-de-campagne, 20%);
.element {
color: $maison-de-campagne;
box-shadow: 0 0 0 2px rgba($maison-de-campagne, 0.35);
}