色名 · #495A4C
Greener Pastures
Greener Pasturesは#495A4C：rgb(73 90 76)、hsl(131 10% 32%)、oklch(0.449 0.031 150.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Greener Pastures color name →
#495A4C
oklch(0.449 0.031 150.1)
カラー変換
- HEX
- #495a4c
- RGB
- rgb(73 90 76)
- HSL
- hsl(131 10% 32%)
- HWB
- hwb(131 29% 65%)
- OKLCH
- oklch(0.449 0.031 150.1)
- OKLab
- oklab(0.449 -0.027 0.015)
- CIE Lab
- lab(36.46 -9.18 5.84)
- LCH
- lch(36.46 10.88 147.5)
- CMYK
- cmyk(19% 0% 16% 65%)
ティント · シェード · トーン
ティント
- 59695C
- 6A796D
- 7C887E
- 8D988F
- 9FA9A1
- B2BAB3
- C5CBC6
- D8DCD8
- EBEDEC
シェード
- 3E4D41
- 344136
- 2A352C
- 202922
- 171E18
- 0E130F
- 060906
- 020302
- 000000
トーン
- 4E5E51
- 546156
- 59655B
- 5F6960
- 646D66
- 6A716B
- 6F7470
- 757875
- 7A7C7B
カラーハーモニー
補色 +180°
- 495A4C
Greener Pastures
- 5F4F5D
≈ Wishing Star
類似色 -30° +30°
- 495A4C
Greener Pastures
- 525845
≈ Castle Stone
- 425B56
≈ Canadian Fir
トライアド +120° +240°
- 495A4C
Greener Pastures
- 4E5467
≈ Lap of Luxury
- 654F4B
≈ Congo Brown
スプリットコンプリメンタリー +150° +210°
- 495A4C
Greener Pastures
- 575164
≈ Freefall
- 644E54
≈ Berry Wine
テトラード +90° +180° +270°
- 495A4C
Greener Pastures
- 465865
≈ Tetsu Iron
- 5F4F5D
≈ Wishing Star
- 625144
≈ Volcanic Island
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 7.36:1 · APCA Lc 86
Ag
Fail黒の上
WCAG 2.85:1 · APCA Lc 16
最適な文字色: #FFFFFF
WCAG 7.36:1 (AAA) · APCA Lc 86
Contrast pairs
コードスニペット
CSS
:root {
--greener-pastures: #495a4c;
--greener-pastures-rgb: 73 90 76;
--greener-pastures-oklch: oklch(0.449 0.031 150.1);
}
.element {
color: var(--greener-pastures);
background-color: hsl(131 10% 32%);
border-color: oklch(0.449 0.031 150.1);
}Tailwind CSS v4
@theme {
--color-greener-pastures: #495a4c;
--color-greener-pastures-50: #eff8f1;
--color-greener-pastures-100: #e1ebe3;
--color-greener-pastures-200: #cbd8ce;
--color-greener-pastures-300: #acbcb0;
--color-greener-pastures-400: #92a495;
--color-greener-pastures-500: #788c7c;
--color-greener-pastures-600: #667769;
--color-greener-pastures-700: #515f54;
--color-greener-pastures-800: #3b453c;
--color-greener-pastures-900: #29302a;
--color-greener-pastures-950: #171c17;
}SCSS
$greener-pastures: #495a4c;
$greener-pastures-rgb: 73, 90, 76;
$greener-pastures-light: mix(#fff, $greener-pastures, 20%);
$greener-pastures-dark: mix(#000, $greener-pastures, 20%);
.element {
color: $greener-pastures;
box-shadow: 0 0 0 2px rgba($greener-pastures, 0.35);
}