最も近い色名 · #2ED8FF
#2ED8FF
最も近い色名: Neon Blue
#2ED8FF(rgb(46 216 255)、hsl(191 100% 59%)、oklch(0.817 0.139 218.3))に最も近い色名はNeon Blueです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#2ED8FF
oklch(0.817 0.139 218.3)
カラー変換
- HEX
- #2ed8ff
- RGB
- rgb(46 216 255)
- HSL
- hsl(191 100% 59%)
- HWB
- hwb(191 18% 0%)
- OKLCH
- oklch(0.817 0.139 218.3)
- OKLab
- oklab(0.817 -0.109 -0.086)
- CIE Lab
- lab(79.56 -33.03 -31.63)
- LCH
- lch(79.56 45.73 223.8)
- CMYK
- cmyk(82% 15% 0% 0%)
ティント · シェード · トーン
ティント
- 55DCFF
- 70E1FF
- 86E5FF
- 9AE9FF
- ACEDFF
- BEF1FF
- CFF4FF
- DFF8FF
- EFFCFF
シェード
- 27BCDE
- 1FA0BE
- 18859E
- 126B80
- 0B5363
- 063B48
- 02252E
- 011116
- 000203
トーン
- 44CFF2
- 53C6E5
- 5EBED8
- 67B5CB
- 6DACBE
- 73A3B2
- 779AA5
- 7B9299
- 7E898C
カラーハーモニー
補色 +180°
- 2ED8FF
Neon Blue
- FFAB91
≈ Frozen Salmon
類似色 -30° +30°
- 2ED8FF
Neon Blue
- 1AE0D4
≈ Fresh Turquoise
- 91C9FF
≈ Clear Sky
トライアド +120° +240°
- 2ED8FF
Neon Blue
- FD9FE2
≈ Lavender Rose
- DBC44D
≈ Yellow Magic Orchestra
スプリットコンプリメンタリー +150° +210°
- 2ED8FF
Neon Blue
- FFA6B6
≈ Amélie’s Tutu
- FEB156
≈ Duckling
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.69:1 · APCA Lc 30
Ag
AAA黒の上
WCAG 12.38:1 · APCA Lc 73
最適な文字色: #000000
WCAG 12.38:1 (AAA) · APCA Lc 73
Contrast pairs
コードスニペット
CSS
:root {
--neon-blue: #2ed8ff;
--neon-blue-rgb: 46 216 255;
--neon-blue-oklch: oklch(0.817 0.139 218.3);
}
.element {
color: var(--neon-blue);
background-color: hsl(191 100% 59%);
border-color: oklch(0.817 0.139 218.3);
}Tailwind CSS v4
@theme {
--color-neon-blue: #2ed8ff;
--color-neon-blue-50: #caffff;
--color-neon-blue-100: #b4f4ff;
--color-neon-blue-200: #8ee3fe;
--color-neon-blue-300: #57c8e9;
--color-neon-blue-400: #00b1d5;
--color-neon-blue-500: #009ac3;
--color-neon-blue-600: #0082a5;
--color-neon-blue-700: #006884;
--color-neon-blue-800: #004d61;
--color-neon-blue-900: #003644;
--color-neon-blue-950: #00202c;
}SCSS
$neon-blue: #2ed8ff;
$neon-blue-rgb: 46, 216, 255;
$neon-blue-light: mix(#fff, $neon-blue, 20%);
$neon-blue-dark: mix(#000, $neon-blue, 20%);
.element {
color: $neon-blue;
box-shadow: 0 0 0 2px rgba($neon-blue, 0.35);
}