色名 · #59636A
Calligraphy
Calligraphyは#59636A：rgb(89 99 106)、hsl(205 9% 38%)、oklch(0.494 0.017 238.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Calligraphy color name →
#59636A
oklch(0.494 0.017 238.3)
カラー変換
- HEX
- #59636a
- RGB
- rgb(89 99 106)
- HSL
- hsl(205 9% 38%)
- HWB
- hwb(205 35% 58%)
- OKLCH
- oklch(0.494 0.017 238.3)
- OKLab
- oklab(0.494 -0.009 -0.014)
- CIE Lab
- lab(41.28 -2.78 -5.36)
- LCH
- lch(41.28 6.04 242.6)
- CMYK
- cmyk(16% 7% 0% 58%)
ティント · シェード · トーン
ティント
- 687178
- 788086
- 888F94
- 989EA3
- A8AEB2
- B9BEC1
- CACED0
- DCDEDF
- EDEEEF
シェード
- 4C555B
- 40474D
- 343A3F
- 282E31
- 1D2124
- 131618
- 090B0D
- 030304
- 000000
トーン
- 5D666C
- 61696E
- 656C71
- 686E73
- 6C7175
- 707477
- 747779
- 787A7C
- 7C7D7E
カラーハーモニー
補色 +180°
- 59636A
Calligraphy
- 695F58
≈ Brood
類似色 -30° +30°
- 59636A
Calligraphy
- 576466
≈ Greys Harbor
- 5D616B
≈ Script Ink
トライアド +120° +240°
- 59636A
Calligraphy
- 6A5E61
≈ Vintage Plum
- 606358
≈ English Forest
スプリットコンプリメンタリー +150° +210°
- 59636A
Calligraphy
- 6B5E5C
≈ Moroccan Dusk
- 656157
≈ Rikyūnezumi Brown
テトラード +90° +180° +270°
- 59636A
Calligraphy
- 675E66
≈ Moire Satin
- 695F58
≈ Brood
- 5B645C
≈ Woodland Moss
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.14:1 · APCA Lc 81
Ag
Fail黒の上
WCAG 3.41:1 · APCA Lc 21
最適な文字色: #FFFFFF
WCAG 6.14:1 (AA) · APCA Lc 81
Contrast pairs
コードスニペット
CSS
:root {
--calligraphy: #59636a;
--calligraphy-rgb: 89 99 106;
--calligraphy-oklch: oklch(0.494 0.017 238.3);
}
.element {
color: var(--calligraphy);
background-color: hsl(205 9% 38%);
border-color: oklch(0.494 0.017 238.3);
}Tailwind CSS v4
@theme {
--color-calligraphy: #59636a;
--color-calligraphy-50: #f1f6f9;
--color-calligraphy-100: #e3e9ed;
--color-calligraphy-200: #ced5db;
--color-calligraphy-300: #b0b9bf;
--color-calligraphy-400: #96a0a7;
--color-calligraphy-500: #7c8890;
--color-calligraphy-600: #69737a;
--color-calligraphy-700: #545c62;
--color-calligraphy-800: #3d4347;
--color-calligraphy-900: #2a2f31;
--color-calligraphy-950: #181b1d;
}SCSS
$calligraphy: #59636a;
$calligraphy-rgb: 89, 99, 106;
$calligraphy-light: mix(#fff, $calligraphy, 20%);
$calligraphy-dark: mix(#000, $calligraphy, 20%);
.element {
color: $calligraphy;
box-shadow: 0 0 0 2px rgba($calligraphy, 0.35);
}