色名 · #DAA631
Golden Grass
Golden Grassは#DAA631：rgb(218 166 49)、hsl(42 70% 52%)、oklch(0.754 0.14 83)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Golden Grass color name →
#DAA631
oklch(0.754 0.14 83)
カラー変換
- HEX
- #daa631
- RGB
- rgb(218 166 49)
- HSL
- hsl(42 70% 52%)
- HWB
- hwb(42 19% 15%)
- OKLCH
- oklch(0.754 0.14 83)
- OKLab
- oklab(0.754 0.017 0.139)
- CIE Lab
- lab(71.64 12.08 63.76)
- LCH
- lch(71.64 64.89 79.3)
- CMYK
- cmyk(0% 24% 78% 15%)
ティント · シェード · トーン
ティント
- DEAF4E
- E2B866
- E6C17B
- E9CA8F
- EDD3A2
- F1DCB5
- F4E5C8
- F8EEDA
- FCF6ED
シェード
- BD9029
- A27A22
- 87651A
- 6C5113
- 543E0C
- 3C2B06
- 251A03
- 110A01
- 020100
トーン
- D1A240
- C89F4C
- BF9B56
- B6985E
- AC9465
- A4906B
- 9B8C71
- 928877
- 89847B
カラーハーモニー
補色 +180°
- DAA631
Golden Grass
- 85AEFF
≈ Kitten’s Eye
類似色 -30° +30°
- DAA631
Golden Grass
- F49454
≈ Toucan
- B0B842
≈ Hopscotch
トライアド +120° +240°
- DAA631
Golden Grass
- 00C6D3
≈ Turquoise Surf
- DA90E2
≈ Bright Lilac
スプリットコンプリメンタリー +150° +210°
- DAA631
Golden Grass
- 38BDF9
≈ Megaman
- B39DFF
≈ Shy Moment
テトラード +90° +180° +270°
- DAA631
Golden Grass
- 1FCBA7
≈ Mint Leaf
- 85AEFF
≈ Kitten’s Eye
- F288B7
≈ Brown Knapweed
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.21:1 · APCA Lc 43
Ag
AAA黒の上
WCAG 9.47:1 · APCA Lc 59
最適な文字色: #000000
WCAG 9.47:1 (AAA) · APCA Lc 59
Contrast pairs
コードスニペット
CSS
:root {
--golden-grass: #daa631;
--golden-grass-rgb: 218 166 49;
--golden-grass-oklch: oklch(0.754 0.14 83);
}
.element {
color: var(--golden-grass);
background-color: hsl(42 70% 52%);
border-color: oklch(0.754 0.14 83);
}Tailwind CSS v4
@theme {
--color-golden-grass: #daa631;
--color-golden-grass-50: #fff3c8;
--color-golden-grass-100: #fde5b3;
--color-golden-grass-200: #f0d08e;
--color-golden-grass-300: #d8b25e;
--color-golden-grass-400: #c69626;
--color-golden-grass-500: #b27b00;
--color-golden-grass-600: #976800;
--color-golden-grass-700: #795300;
--color-golden-grass-800: #5b3c00;
--color-golden-grass-900: #3f2900;
--color-golden-grass-950: #281600;
}SCSS
$golden-grass: #daa631;
$golden-grass-rgb: 218, 166, 49;
$golden-grass-light: mix(#fff, $golden-grass, 20%);
$golden-grass-dark: mix(#000, $golden-grass, 20%);
.element {
color: $golden-grass;
box-shadow: 0 0 0 2px rgba($golden-grass, 0.35);
}