色名 · #BEA77D
Sonora Hills
Sonora Hillsは#BEA77D：rgb(190 167 125)、hsl(39 33% 62%)、oklch(0.738 0.063 82.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Sonora Hills color name →
#BEA77D
oklch(0.738 0.063 82.3)
カラー変換
- HEX
- #bea77d
- RGB
- rgb(190 167 125)
- HSL
- hsl(39 33% 62%)
- HWB
- hwb(39 49% 25%)
- OKLCH
- oklch(0.738 0.063 82.3)
- OKLab
- oklab(0.738 0.008 0.062)
- CIE Lab
- lab(69.76 4.1 25.02)
- LCH
- lch(69.76 25.36 80.7)
- CMYK
- cmyk(0% 12% 34% 25%)
ティント · シェード · トーン
ティント
- C4B08A
- CBB897
- D1C1A3
- D8CAB0
- DED2BD
- E5DBCA
- EBE4D7
- F2EDE4
- F8F6F2
シェード
- A5916C
- 8C7B5B
- 75664B
- 5E523B
- 483E2C
- 332C1E
- 1F1A11
- 0D0A05
- 020101
トーン
- B8A37E
- B19F7E
- AB9B7F
- A5977F
- 9F9380
- 989080
- 928C80
- 8C8880
- 868480
カラーハーモニー
補色 +180°
- BEA77D
Sonora Hills
- 95ABD3
≈ Victory Lake
類似色 -30° +30°
- BEA77D
Sonora Hills
- CBA086
≈ Arbol de Tamarindo
- AAAF81
≈ Wall Green
トライアド +120° +240°
- BEA77D
Sonora Hills
- 7AB6BB
≈ Aqua Blue
- BE9DC2
≈ Lupine
スプリットコンプリメンタリー +150° +210°
- BEA77D
Sonora Hills
- 82B2CB
≈ Batch Blue
- ABA3CF
≈ Puturple
テトラード +90° +180° +270°
- BEA77D
Sonora Hills
- 81B8A6
≈ Patina Hue
- 95ABD3
≈ Victory Lake
- CA9AAE
≈ Rosebay
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.32:1 · APCA Lc 46
Ag
AAA黒の上
WCAG 9.01:1 · APCA Lc 56
最適な文字色: #000000
WCAG 9.01:1 (AAA) · APCA Lc 56
Contrast pairs
コードスニペット
CSS
:root {
--sonora-hills: #bea77d;
--sonora-hills-rgb: 190 167 125;
--sonora-hills-oklch: oklch(0.738 0.063 82.3);
}
.element {
color: var(--sonora-hills);
background-color: hsl(39 33% 62%);
border-color: oklch(0.738 0.063 82.3);
}Tailwind CSS v4
@theme {
--color-sonora-hills: #bea77d;
--color-sonora-hills-50: #fef4e1;
--color-sonora-hills-100: #f2e7d1;
--color-sonora-hills-200: #e1d3b6;
--color-sonora-hills-300: #c7b593;
--color-sonora-hills-400: #b19b74;
--color-sonora-hills-500: #9b8255;
--color-sonora-hills-600: #836e49;
--color-sonora-hills-700: #69583a;
--color-sonora-hills-800: #4e4029;
--color-sonora-hills-900: #362c1b;
--color-sonora-hills-950: #21190c;
}SCSS
$sonora-hills: #bea77d;
$sonora-hills-rgb: 190, 167, 125;
$sonora-hills-light: mix(#fff, $sonora-hills, 20%);
$sonora-hills-dark: mix(#000, $sonora-hills, 20%);
.element {
color: $sonora-hills;
box-shadow: 0 0 0 2px rgba($sonora-hills, 0.35);
}