最も近い色名 · #3FAFA9
#3FAFA9
最も近い色名: Verdigris
#3FAFA9（rgb(63 175 169)、hsl(177 47% 47%)、oklch(0.69 0.1 190.1)）に最も近い色名はVerdigrisです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#3FAFA9
oklch(0.69 0.1 190.1)
カラー変換
- HEX
- #3fafa9
- RGB
- rgb(63 175 169)
- HSL
- hsl(177 47% 47%)
- HWB
- hwb(177 25% 31%)
- OKLCH
- oklch(0.69 0.1 190.1)
- OKLab
- oklab(0.69 -0.099 -0.017)
- CIE Lab
- lab(65.16 -33.75 -6.78)
- LCH
- lch(65.16 34.42 191.4)
- CMYK
- cmyk(64% 0% 3% 31%)
ティント · シェード · トーン
ティント
- 59B7B1
- 6EBFBA
- 82C7C2
- 95CFCB
- A7D7D3
- B9DFDC
- CBE7E5
- DCEFED
- EEF7F6
シェード
- 359892
- 2C817C
- 236B67
- 1B5653
- 12413F
- 0A2E2C
- 041C1B
- 010B0A
- 000101
トーン
- 4BAAA5
- 55A6A1
- 5DA19D
- 649C98
- 6A9894
- 6F9390
- 748E8C
- 788A88
- 7C8584
カラーハーモニー
補色 +180°
- 3FAFA9
Verdigris
- D1818D
≈ I Pink I Can
類似色 -30° +30°
- 3FAFA9
Verdigris
- 5FAE86
≈ Verdigris Green
- 46AAC6
≈ Dragonfly Blue
トライアド +120° +240°
- 3FAFA9
Verdigris
- AE8ACA
≈ Creeping Bellflower
- C39053
≈ Twine
スプリットコンプリメンタリー +150° +210°
- 3FAFA9
Verdigris
- C582AF
≈ Moonlight Mauve
- D0866B
≈ Rosy Pashmina
テトラード +90° +180° +270°
- 3FAFA9
Verdigris
- 8F94D8
≈ Portage
- D1818D
≈ I Pink I Can
- AA9D4F
≈ Organic Matter
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.65:1 · APCA Lc 51
Ag
AAA黒の上
WCAG 7.91:1 · APCA Lc 51
最適な文字色: #000000
WCAG 7.91:1 (AAA) · APCA Lc 51
Contrast pairs
コードスニペット
CSS
:root {
--verdigris: #3fafa9;
--verdigris-rgb: 63 175 169;
--verdigris-oklch: oklch(0.69 0.1 190.1);
}
.element {
color: var(--verdigris);
background-color: hsl(177 47% 47%);
border-color: oklch(0.69 0.1 190.1);
}Tailwind CSS v4
@theme {
--color-verdigris: #3fafa9;
--color-verdigris-50: #d5fffc;
--color-verdigris-100: #c2f3f0;
--color-verdigris-200: #a2e2df;
--color-verdigris-300: #77c8c4;
--color-verdigris-400: #4bb1ab;
--color-verdigris-500: #009b95;
--color-verdigris-600: #00837e;
--color-verdigris-700: #046965;
--color-verdigris-800: #034d49;
--color-verdigris-900: #033632;
--color-verdigris-950: #00211e;
}SCSS
$verdigris: #3fafa9;
$verdigris-rgb: 63, 175, 169;
$verdigris-light: mix(#fff, $verdigris, 20%);
$verdigris-dark: mix(#000, $verdigris, 20%);
.element {
color: $verdigris;
box-shadow: 0 0 0 2px rgba($verdigris, 0.35);
}