最も近い色名 · #86B6F2
#86B6F2
最も近い色名: Fly Away
#86B6F2（rgb(134 182 242)、hsl(213 81% 74%)、oklch(0.765 0.101 254.4)）に最も近い色名はFly Awayです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#86B6F2
oklch(0.765 0.101 254.4)
カラー変換
- HEX
- #86b6f2
- RGB
- rgb(134 182 242)
- HSL
- hsl(213 81% 74%)
- HWB
- hwb(213 53% 5%)
- OKLCH
- oklch(0.765 0.101 254.4)
- OKLab
- oklab(0.765 -0.027 -0.097)
- CIE Lab
- lab(72.38 -4.6 -35.4)
- LCH
- lch(72.38 35.69 262.6)
- CMYK
- cmyk(45% 25% 0% 5%)
ティント · シェード · トーン
ティント
- 92BDF4
- 9EC5F5
- AACCF7
- B6D3F8
- C2DBFA
- CEE2FB
- DAE9FC
- E7F1FD
- F3F8FE
シェード
- 749ED2
- 6286B4
- 516F96
- 405979
- 30445E
- 213043
- 131D2B
- 060C14
- 010203
トーン
- 86B1E6
- 86ABDB
- 85A6CF
- 85A1C4
- 849BB8
- 8496AD
- 8390A2
- 828B96
- 81858B
カラーハーモニー
補色 +180°
- 86B6F2
Fly Away
- D9A967
≈ Sugar Honey Cashew
類似色 -30° +30°
- 86B6F2
Fly Away
- 63C1E3
≈ Magnesia Bay
- ABAAF1
≈ Maximum Blue Purple
トライアド +120° +240°
- 86B6F2
Fly Away
- EC989F
≈ Pink Floyd
- 98C17F
≈ Picnic
スプリットコンプリメンタリー +150° +210°
- 86B6F2
Fly Away
- E99E7D
≈ Les Demoiselles d’Avignon
- BDB668
≈ Motherland
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.10:1 · APCA Lc 41
Ag
AAA黒の上
WCAG 9.98:1 · APCA Lc 61
最適な文字色: #000000
WCAG 9.98:1 (AAA) · APCA Lc 61
Contrast pairs
コードスニペット
CSS
:root {
--fly-away: #86b6f2;
--fly-away-rgb: 134 182 242;
--fly-away-oklch: oklch(0.765 0.101 254.4);
}
.element {
color: var(--fly-away);
background-color: hsl(213 81% 74%);
border-color: oklch(0.765 0.101 254.4);
}Tailwind CSS v4
@theme {
--color-fly-away: #86b6f2;
--color-fly-away-50: #e3f7ff;
--color-fly-away-100: #d3eaff;
--color-fly-away-200: #b9d7ff;
--color-fly-away-300: #96baeb;
--color-fly-away-400: #75a1d9;
--color-fly-away-500: #5588c8;
--color-fly-away-600: #4974a8;
--color-fly-away-700: #3a5c87;
--color-fly-away-800: #274464;
--color-fly-away-900: #1a2f46;
--color-fly-away-950: #0b1b2e;
}SCSS
$fly-away: #86b6f2;
$fly-away-rgb: 134, 182, 242;
$fly-away-light: mix(#fff, $fly-away, 20%);
$fly-away-dark: mix(#000, $fly-away, 20%);
.element {
color: $fly-away;
box-shadow: 0 0 0 2px rgba($fly-away, 0.35);
}