色名 · #A4BF20
Pea
Peaは#A4BF20：rgb(164 191 32)、hsl(70 71% 44%)、oklch(0.758 0.171 119.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Pea color name →
#A4BF20
oklch(0.758 0.171 119.7)
カラー変換
- HEX
- #a4bf20
- RGB
- rgb(164 191 32)
- HSL
- hsl(70 71% 44%)
- HWB
- hwb(70 13% 25%)
- OKLCH
- oklch(0.758 0.171 119.7)
- OKLab
- oklab(0.758 -0.085 0.149)
- CIE Lab
- lab(73.35 -23.56 67.85)
- LCH
- lch(73.35 71.82 109.2)
- CMYK
- cmyk(14% 0% 83% 25%)
ティント · シェード · トーン
ティント
- ACC646
- B5CC60
- BED377
- C7DA8C
- D0E0A0
- D9E6B3
- E2EDC7
- ECF3D9
- F5F9EC
シェード
- 8EA61A
- 798D15
- 64750F
- 505E0A
- 3D4806
- 2B3303
- 1A1F01
- 0A0D00
- 010200
トーン
- A0B937
- 9CB345
- 99AC51
- 95A65A
- 91A063
- 8E9A6A
- 8A9370
- 878D76
- 83877B
カラーハーモニー
補色 +180°
- A4BF20
Pea
- BF9AFF
≈ Lilás
類似色 -30° +30°
トライアド +120° +240°
スプリットコンプリメンタリー +150° +210°
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.08:1 · APCA Lc 41
Ag
AAA黒の上
WCAG 10.05:1 · APCA Lc 62
最適な文字色: #000000
WCAG 10.05:1 (AAA) · APCA Lc 62
Contrast pairs
コードスニペット
CSS
:root {
--pea: #a4bf20;
--pea-rgb: 164 191 32;
--pea-oklch: oklch(0.758 0.171 119.7);
}
.element {
color: var(--pea);
background-color: hsl(70 71% 44%);
border-color: oklch(0.758 0.171 119.7);
}Tailwind CSS v4
@theme {
--color-pea: #a4bf20;
--color-pea-50: #edfec7;
--color-pea-100: #def2b1;
--color-pea-200: #c8e08c;
--color-pea-300: #a9c55a;
--color-pea-400: #93ac0e;
--color-pea-500: #7a9400;
--color-pea-600: #677d00;
--color-pea-700: #526400;
--color-pea-800: #3e4900;
--color-pea-900: #2b3300;
--color-pea-950: #181e00;
}SCSS
$pea: #a4bf20;
$pea-rgb: 164, 191, 32;
$pea-light: mix(#fff, $pea, 20%);
$pea-dark: mix(#000, $pea, 20%);
.element {
color: $pea;
box-shadow: 0 0 0 2px rgba($pea, 0.35);
}