色名 · #BBAF5E
Gilded Pesto
Gilded Pestoは#BBAF5E：rgb(187 175 94)、hsl(52 41% 55%)、oklch(0.747 0.104 101)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Gilded Pesto color name →
#BBAF5E
oklch(0.747 0.104 101)
カラー変換
- HEX
- #bbaf5e
- RGB
- rgb(187 175 94)
- HSL
- hsl(52 41% 55%)
- HWB
- hwb(52 37% 27%)
- OKLCH
- oklch(0.747 0.104 101)
- OKLab
- oklab(0.747 -0.02 0.102)
- CIE Lab
- lab(71.19 -3.61 42.74)
- LCH
- lch(71.19 42.89 94.8)
- CMYK
- cmyk(0% 6% 50% 27%)
ティント · シェード · トーン
ティント
- C2B76F
- C8BF80
- CFC790
- D5CFA0
- DCD7B0
- E3DFC0
- EAE7D0
- F1EFDF
- F8F7EF
シェード
- A29851
- 8A8144
- 736B37
- 5C562B
- 46411F
- 322E14
- 1F1C0A
- 0D0B03
- 020100
トーン
- B5AA63
- AFA668
- A9A16C
- A39C6F
- 9D9873
- 979376
- 918E79
- 8B8A7B
- 86857E
カラーハーモニー
補色 +180°
- BBAF5E
Gilded Pesto
- A1A5ED
≈ Cold Lips
類似色 -30° +30°
- BBAF5E
Gilded Pesto
- D6A260
≈ Amber Brew
- 96BB74
≈ Olivine
トライアド +120° +240°
- BBAF5E
Gilded Pesto
- 57BCDB
≈ Azurean
- DA93C0
≈ Firm Pink
スプリットコンプリメンタリー +150° +210°
- BBAF5E
Gilded Pesto
- 7AB1EC
≈ Lucea
- C29ADD
≈ Mauve Mist
テトラード +90° +180° +270°
- BBAF5E
Gilded Pesto
- 4EC2BD
≈ Port Hope
- A1A5ED
≈ Cold Lips
- E6919D
≈ Peony
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.23:1 · APCA Lc 44
Ag
AAA黒の上
WCAG 9.40:1 · APCA Lc 58
最適な文字色: #000000
WCAG 9.40:1 (AAA) · APCA Lc 58
Contrast pairs
コードスニペット
CSS
:root {
--gilded-pesto: #bbaf5e;
--gilded-pesto-rgb: 187 175 94;
--gilded-pesto-oklch: oklch(0.747 0.104 101);
}
.element {
color: var(--gilded-pesto);
background-color: hsl(52 41% 55%);
border-color: oklch(0.747 0.104 101);
}Tailwind CSS v4
@theme {
--color-gilded-pesto: #bbaf5e;
--color-gilded-pesto-50: #faf7d5;
--color-gilded-pesto-100: #eeeac3;
--color-gilded-pesto-200: #dcd7a4;
--color-gilded-pesto-300: #c1ba7b;
--color-gilded-pesto-400: #aca054;
--color-gilded-pesto-500: #958828;
--color-gilded-pesto-600: #7e7324;
--color-gilded-pesto-700: #655c1d;
--color-gilded-pesto-800: #4b4312;
--color-gilded-pesto-900: #342e0b;
--color-gilded-pesto-950: #201b01;
}SCSS
$gilded-pesto: #bbaf5e;
$gilded-pesto-rgb: 187, 175, 94;
$gilded-pesto-light: mix(#fff, $gilded-pesto, 20%);
$gilded-pesto-dark: mix(#000, $gilded-pesto, 20%);
.element {
color: $gilded-pesto;
box-shadow: 0 0 0 2px rgba($gilded-pesto, 0.35);
}