最も近い色名 · #4C92D4
#4C92D4
最も近い色名: Magical Merlin
#4C92D4(rgb(76 146 212)、hsl(209 61% 56%)、oklch(0.644 0.122 249))に最も近い色名はMagical Merlinです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#4C92D4
oklch(0.644 0.122 249)
カラー変換
- HEX
- #4c92d4
- RGB
- rgb(76 146 212)
- HSL
- hsl(209 61% 56%)
- HWB
- hwb(209 30% 17%)
- OKLCH
- oklch(0.644 0.122 249)
- OKLab
- oklab(0.644 -0.044 -0.114)
- CIE Lab
- lab(58.23 -7.02 -41.15)
- LCH
- lch(58.23 41.75 260.3)
- CMYK
- cmyk(64% 31% 0% 17%)
ティント · シェード · トーン
ティント
- 5F9DD9
- 72A8DE
- 83B3E2
- 95BEE7
- A7C9EB
- B8D4F0
- CADEF4
- DBE9F8
- EDF4FB
シェード
- 417EB8
- 366B9D
- 2C5883
- 224669
- 183551
- 0F253A
- 061624
- 020810
- 000102
トーン
- 5391CC
- 5A8FC3
- 5F8EBB
- 658CB3
- 6A8AAA
- 6F88A2
- 73869A
- 788491
- 7C8289
カラーハーモニー
補色 +180°
- 4C92D4
Magical Merlin
- BD7E2C
≈ Autumn Fest
類似色 -30° +30°
- 4C92D4
Magical Merlin
- 009DBD
≈ Ahriman Blue
- 7E84D6
≈ Tanzine
トライアド +120° +240°
- 4C92D4
Magical Merlin
- CB6B7E
≈ Artful Pink
- 769B46
≈ Mossy Glossy
スプリットコンプリメンタリー +150° +210°
- 4C92D4
Magical Merlin
- CB7153
≈ Dusted Clay
- A08E23
≈ Nurgle’s Rot
テトラード +90° +180° +270°
- 4C92D4
Magical Merlin
- BD6EA6
≈ Crocus
- BD7E2C
≈ Autumn Fest
- 3BA372
≈ Linoleum Green
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.29:1 · APCA Lc 60
Ag
AA黒の上
WCAG 6.36:1 · APCA Lc 42
最適な文字色: #000000
WCAG 6.36:1 (AA) · APCA Lc 42
Contrast pairs
コードスニペット
CSS
:root {
--magical-merlin: #4c92d4;
--magical-merlin-rgb: 76 146 212;
--magical-merlin-oklch: oklch(0.644 0.122 249);
}
.element {
color: var(--magical-merlin);
background-color: hsl(209 61% 56%);
border-color: oklch(0.644 0.122 249);
}Tailwind CSS v4
@theme {
--color-magical-merlin: #4c92d4;
--color-magical-merlin-50: #dcf9ff;
--color-magical-merlin-100: #caecff;
--color-magical-merlin-200: #aed9ff;
--color-magical-merlin-300: #88bcf4;
--color-magical-merlin-400: #62a4e3;
--color-magical-merlin-500: #3b8bd3;
--color-magical-merlin-600: #3375b2;
--color-magical-merlin-700: #295e8f;
--color-magical-merlin-800: #19456a;
--color-magical-merlin-900: #10304b;
--color-magical-merlin-950: #031c31;
}SCSS
$magical-merlin: #4c92d4;
$magical-merlin-rgb: 76, 146, 212;
$magical-merlin-light: mix(#fff, $magical-merlin, 20%);
$magical-merlin-dark: mix(#000, $magical-merlin, 20%);
.element {
color: $magical-merlin;
box-shadow: 0 0 0 2px rgba($magical-merlin, 0.35);
}