色名 · #A4AE77
Tarragon
Tarragonは#A4AE77：rgb(164 174 119)、hsl(71 25% 57%)、oklch(0.729 0.076 116.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Tarragon color name →
#A4AE77
oklch(0.729 0.076 116.7)
カラー変換
- HEX
- #a4ae77
- RGB
- rgb(164 174 119)
- HSL
- hsl(71 25% 57%)
- HWB
- hwb(71 47% 32%)
- OKLCH
- oklch(0.729 0.076 116.7)
- OKLab
- oklab(0.729 -0.034 0.068)
- CIE Lab
- lab(69.27 -10.44 27.07)
- LCH
- lch(69.27 29.01 111.1)
- CMYK
- cmyk(6% 0% 32% 32%)
ティント · シェード · トーン
ティント
- ADB684
- B5BE92
- BEC69F
- C7CEAD
- D0D6BA
- DADEC8
- E3E6D6
- ECEFE3
- F6F7F1
シェード
- 8E9767
- 798057
- 646A47
- 505538
- 3D412A
- 2B2E1C
- 1A1C10
- 0A0B05
- 010101
トーン
- A0A978
- 9DA57A
- 99A07B
- 959C7C
- 92977D
- 8E927E
- 8B8E7E
- 87897F
- 838580
カラーハーモニー
補色 +180°
- A4AE77
Tarragon
- AC9ED2
≈ Imperial Lilac
類似色 -30° +30°
- A4AE77
Tarragon
- BCA570
≈ Horn of Plenty
- 88B58C
≈ Chatty Cricket
トライアド +120° +240°
- A4AE77
Tarragon
- 79AFD1
≈ Meadow Blossom Blue
- CF94A8
≈ Madagascar Pink
スプリットコンプリメンタリー +150° +210°
- A4AE77
Tarragon
- 92A7D8
≈ Foresight
- C197C1
≈ Lupine
テトラード +90° +180° +270°
- A4AE77
Tarragon
- 6BB5BF
≈ Adonis
- AC9ED2
≈ Imperial Lilac
- D3958E
≈ Powder Blush
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.35:1 · APCA Lc 47
Ag
AAA黒の上
WCAG 8.89:1 · APCA Lc 56
最適な文字色: #000000
WCAG 8.89:1 (AAA) · APCA Lc 56
Contrast pairs
コードスニペット
CSS
:root {
--tarragon: #a4ae77;
--tarragon-rgb: 164 174 119;
--tarragon-oklch: oklch(0.729 0.076 116.7);
}
.element {
color: var(--tarragon);
background-color: hsl(71 25% 57%);
border-color: oklch(0.729 0.076 116.7);
}Tailwind CSS v4
@theme {
--color-tarragon: #a4ae77;
--color-tarragon-50: #f2f9e1;
--color-tarragon-100: #e5ecd0;
--color-tarragon-200: #d0d9b5;
--color-tarragon-300: #b3bd92;
--color-tarragon-400: #9ba571;
--color-tarragon-500: #838d51;
--color-tarragon-600: #6f7745;
--color-tarragon-700: #585f37;
--color-tarragon-800: #424626;
--color-tarragon-900: #2d3019;
--color-tarragon-950: #1a1c0a;
}SCSS
$tarragon: #a4ae77;
$tarragon-rgb: 164, 174, 119;
$tarragon-light: mix(#fff, $tarragon, 20%);
$tarragon-dark: mix(#000, $tarragon, 20%);
.element {
color: $tarragon;
box-shadow: 0 0 0 2px rgba($tarragon, 0.35);
}