色名 · #FED8C2
Friendship
Friendshipは#FED8C2：rgb(254 216 194)、hsl(22 97% 88%)、oklch(0.909 0.052 51.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Friendship color name →
#FED8C2
oklch(0.909 0.052 51.9)
カラー変換
- HEX
- #fed8c2
- RGB
- rgb(254 216 194)
- HSL
- hsl(22 97% 88%)
- HWB
- hwb(22 76% 0%)
- OKLCH
- oklch(0.909 0.052 51.9)
- OKLab
- oklab(0.909 0.032 0.041)
- CIE Lab
- lab(89.18 11.27 16.06)
- LCH
- lch(89.18 19.63 54.9)
- CMYK
- cmyk(0% 15% 24% 0%)
ティント · シェード · トーン
ティント
- FEDCC8
- FFE0CE
- FFE4D4
- FFE8DA
- FFECE0
- FFEFE7
- FFF3ED
- FFF7F3
- FFFBF9
シェード
- DDBCA8
- BDA08F
- 9E8577
- 806B60
- 635349
- 473B34
- 2D2520
- 16110E
- 030202
トーン
- F1CFBB
- E4C6B5
- D7BDAE
- CAB4A7
- BDABA1
- B1A29A
- A49A93
- 98918D
- 8C8886
カラーハーモニー
補色 +180°
- FED8C2
Friendship
- BFE8FE
≈ Blue Java Banana
類似色 -30° +30°
- FED8C2
Friendship
- FFD5D3
≈ Pink Clay
- F2DEBB
≈ Cameo
トライアド +120° +240°
- FED8C2
Friendship
- BFEDDD
≈ Fresh Breeze
- E1DCFF
≈ Transparent Blue
スプリットコンプリメンタリー +150° +210°
- FED8C2
Friendship
- B9ECEF
≈ Cold Blooded
- D1E2FF
≈ Arc Light
テトラード +90° +180° +270°
- FED8C2
Friendship
- CEEACA
≈ Applemint
- BFE8FE
≈ Blue Java Banana
- F2D6F6
≈ Scented Spring
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.32:1 · APCA Lc 16
Ag
AAA黒の上
WCAG 15.81:1 · APCA Lc 88
最適な文字色: #000000
WCAG 15.81:1 (AAA) · APCA Lc 88
Contrast pairs
コードスニペット
CSS
:root {
--friendship: #fed8c2;
--friendship-rgb: 254 216 194;
--friendship-oklch: oklch(0.909 0.052 51.9);
}
.element {
color: var(--friendship);
background-color: hsl(22 97% 88%);
border-color: oklch(0.909 0.052 51.9);
}Tailwind CSS v4
@theme {
--color-friendship: #fed8c2;
--color-friendship-50: #fff2e8;
--color-friendship-100: #f7e4d8;
--color-friendship-200: #e7cfc0;
--color-friendship-300: #cdb19f;
--color-friendship-400: #b89683;
--color-friendship-500: #a37d67;
--color-friendship-600: #896a57;
--color-friendship-700: #6e5545;
--color-friendship-800: #513d32;
--color-friendship-900: #392a22;
--color-friendship-950: #231811;
}SCSS
$friendship: #fed8c2;
$friendship-rgb: 254, 216, 194;
$friendship-light: mix(#fff, $friendship, 20%);
$friendship-dark: mix(#000, $friendship, 20%);
.element {
color: $friendship;
box-shadow: 0 0 0 2px rgba($friendship, 0.35);
}