色名 · #BBA528
Pickle Juice
Pickle Juiceは#BBA528：rgb(187 165 40)、hsl(51 65% 45%)、oklch(0.72 0.138 98.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Pickle Juice color name →
#BBA528
oklch(0.72 0.138 98.6)
カラー変換
- HEX
- #bba528
- RGB
- rgb(187 165 40)
- HSL
- hsl(51 65% 45%)
- HWB
- hwb(51 16% 27%)
- OKLCH
- oklch(0.72 0.138 98.6)
- OKLab
- oklab(0.72 -0.021 0.136)
- CIE Lab
- lab(68.14 -1.09 62.24)
- LCH
- lch(68.14 62.25 91)
- CMYK
- cmyk(0% 12% 79% 27%)
ティント · シェード · トーン
ティント
- C2AE48
- C8B760
- CFC076
- D5C98B
- DCD29E
- E3DBB2
- EAE4C5
- F1EDD9
- F8F6EC
シェード
- A28F21
- 8A791B
- 736515
- 5C510F
- 463D09
- 322B04
- 1F1A02
- 0D0A01
- 020100
トーン
- B5A23A
- AF9E46
- A99A51
- A3975A
- 9D9362
- 978F69
- 918C6F
- 8B8875
- 86847B
カラーハーモニー
補色 +180°
- BBA528
Pickle Juice
- 929AF9
≈ Periwinkle Blue
類似色 -30° +30°
- BBA528
Pickle Juice
- DC9334
≈ Autumn Blaze
- 8AB551
≈ Savoy
トライアド +120° +240°
- BBA528
Pickle Juice
- 00B7DB
≈ Maldives
- DC81C2
≈ Pink Punk
スプリットコンプリメンタリー +150° +210°
- BBA528
Pickle Juice
- 58AAF6
≈ Cerulean
- BD8BE6
≈ Luminous Lavender
テトラード +90° +180° +270°
- BBA528
Pickle Juice
- 00BDB4
≈ Turquoise Topaz
- 929AF9
≈ Periwinkle Blue
- EC7D93
≈ So Charming
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.46:1 · APCA Lc 48
Ag
AAA黒の上
WCAG 8.52:1 · APCA Lc 54
最適な文字色: #000000
WCAG 8.52:1 (AAA) · APCA Lc 54
Contrast pairs
コードスニペット
CSS
:root {
--pickle-juice: #bba528;
--pickle-juice-rgb: 187 165 40;
--pickle-juice-oklch: oklch(0.72 0.138 98.6);
}
.element {
color: var(--pickle-juice);
background-color: hsl(51 65% 45%);
border-color: oklch(0.72 0.138 98.6);
}Tailwind CSS v4
@theme {
--color-pickle-juice: #bba528;
--color-pickle-juice-50: #fdf7ca;
--color-pickle-juice-100: #f2eab5;
--color-pickle-juice-200: #e1d691;
--color-pickle-juice-300: #c7b962;
--color-pickle-juice-400: #b39f2c;
--color-pickle-juice-500: #9e8500;
--color-pickle-juice-600: #867100;
--color-pickle-juice-700: #6b5a00;
--color-pickle-juice-800: #504100;
--color-pickle-juice-900: #382d00;
--color-pickle-juice-950: #231a00;
}SCSS
$pickle-juice: #bba528;
$pickle-juice-rgb: 187, 165, 40;
$pickle-juice-light: mix(#fff, $pickle-juice, 20%);
$pickle-juice-dark: mix(#000, $pickle-juice, 20%);
.element {
color: $pickle-juice;
box-shadow: 0 0 0 2px rgba($pickle-juice, 0.35);
}