最も近い色名 · #607980
#607980
最も近い色名: Catfish
#607980（rgb(96 121 128)、hsl(193 14% 44%)、oklch(0.559 0.031 216.7)）に最も近い色名はCatfishです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#607980
oklch(0.559 0.031 216.7)
カラー変換
- HEX
- #607980
- RGB
- rgb(96 121 128)
- HSL
- hsl(193 14% 44%)
- HWB
- hwb(193 38% 50%)
- OKLCH
- oklch(0.559 0.031 216.7)
- OKLab
- oklab(0.559 -0.025 -0.019)
- CIE Lab
- lab(49.03 -8.13 -7)
- LCH
- lch(49.03 10.73 220.7)
- CMYK
- cmyk(25% 5% 0% 50%)
ティント · シェード · トーン
ティント
- 6F868C
- 7E9298
- 8D9FA4
- 9DADB1
- ADBABE
- BDC7CA
- CDD5D7
- DDE3E4
- EEF1F2
シェード
- 52686E
- 45585D
- 38484D
- 2C393D
- 202B2E
- 151D1F
- 0A1012
- 030506
- 000101
トーン
- 637A80
- 677A80
- 6A7B80
- 6D7C80
- 707D80
- 747D80
- 777E80
- 7A7F80
- 7D7F80
カラーハーモニー
補色 +180°
- 607980
Catfish
- 856E68
≈ Granite Boulder
類似色 -30° +30°
- 607980
Catfish
- 607A77
≈ Refreshing Green
- 667686
≈ Space Convoy
トライアド +120° +240°
- 607980
Catfish
- 816D7B
≈ Splendiferous
- 797460
≈ Lapwing Grey Green
スプリットコンプリメンタリー +150° +210°
- 607980
Catfish
- 856D71
≈ Emotive Ring
- 817161
≈ Elephant
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 4.62:1 · APCA Lc 72
Ag
AA黒の上
WCAG 4.54:1 · APCA Lc 30
最適な文字色: #FFFFFF
WCAG 4.62:1 (AA) · APCA Lc 72
Contrast pairs
コードスニペット
CSS
:root {
--catfish: #607980;
--catfish-rgb: 96 121 128;
--catfish-oklch: oklch(0.559 0.031 216.7);
}
.element {
color: var(--catfish);
background-color: hsl(193 14% 44%);
border-color: oklch(0.559 0.031 216.7);
}Tailwind CSS v4
@theme {
--color-catfish: #607980;
--color-catfish-50: #ecf7fb;
--color-catfish-100: #ddebef;
--color-catfish-200: #c6d8dd;
--color-catfish-300: #a7bcc2;
--color-catfish-400: #8ba3aa;
--color-catfish-500: #6f8c94;
--color-catfish-600: #5f767d;
--color-catfish-700: #4b5f64;
--color-catfish-800: #364549;
--color-catfish-900: #253033;
--color-catfish-950: #141c1e;
}SCSS
$catfish: #607980;
$catfish-rgb: 96, 121, 128;
$catfish-light: mix(#fff, $catfish, 20%);
$catfish-dark: mix(#000, $catfish, 20%);
.element {
color: $catfish;
box-shadow: 0 0 0 2px rgba($catfish, 0.35);
}