色名 · #FFFED9

Sun City

Sun Cityは#FFFED9：rgb(255 254 217)、hsl(58 100% 93%)、oklch(0.988 0.048 106)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Yellow mean? → · Sun City color name →

#FFFED9

oklch(0.988 0.048 106)

カラー変換

HEX: #fffed9
RGB: rgb(255 254 217)
HSL: hsl(58 100% 93%)
HWB: hwb(58 85% 0%)
OKLCH: oklch(0.988 0.048 106)
OKLab: oklab(0.988 -0.013 0.046)
CIE Lab: lab(99.03 -4.11 17.91)
LCH: lch(99.03 18.38 102.9)
CMYK: cmyk(0% 0% 15% 0%)

ティント · シェード · トーン

ティント

FFFEDD
FFFEE1
FFFEE5
FFFEE8
FFFFEC
FFFFF0
FFFFF4
FFFFF8
FFFFFB

シェード

DEDDBC
BEBDA1
9E9E86
80806C
636353
48473B
2E2D25
161611
030302

トーン

F2F1D0
E4E4C7
D7D7BE
CACAB5
BDBDAC
B1B1A3
A4A49A
989891
8C8C89

カラーハーモニー

補色 +180°

FFFED9
Sun City
FBFBFF
≈ Wash Me

類似色 -30° +30°

トライアド +120° +240°

スプリットコンプリメンタリー +150° +210°

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 1.02:1 · APCA Lc 0

Fail

黒の上

WCAG 20.43:1 · APCA Lc 106

AAA

最適な文字色: #000000

WCAG 20.43:1 (AAA) · APCA Lc 106

Contrast pairs

コードスニペット

CSS

:root {
  --sun-city: #fffed9;
  --sun-city-rgb: 255 254 217;
  --sun-city-oklch: oklch(0.988 0.048 106);
}

.element {
  color: var(--sun-city);
  background-color: hsl(58 100% 93%);
  border-color: oklch(0.988 0.048 106);
}

Tailwind CSS v4

@theme {
  --color-sun-city: #fffed9;
  --color-sun-city-50: #f6f6e7;
  --color-sun-city-100: #e9e9d7;
  --color-sun-city-200: #d6d6bf;
  --color-sun-city-300: #b9ba9e;
  --color-sun-city-400: #a2a180;
  --color-sun-city-500: #8a8963;
  --color-sun-city-600: #757455;
  --color-sun-city-700: #5d5c43;
  --color-sun-city-800: #454330;
  --color-sun-city-900: #302f21;
  --color-sun-city-950: #1c1b10;
}

SCSS

$sun-city: #fffed9;
$sun-city-rgb: 255, 254, 217;
$sun-city-light: mix(#fff, $sun-city, 20%);
$sun-city-dark: mix(#000, $sun-city, 20%);

.element {
  color: $sun-city;
  box-shadow: 0 0 0 2px rgba($sun-city, 0.35);
}

近い色名

Palettes with similar colors

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API