Палитра Закат

CSS-переменные

:root {
  --color-1: #FF6B6B;
  --color-2: #FFA07A;
  --color-3: #FFD93D;
  --color-4: #FF8C42;
  --color-5: #C9484B;
}

Конфиг Tailwind

// tailwind.config.js
colors: {
  "sunset-1": "#FF6B6B",
  "sunset-2": "#FFA07A",
  "sunset-3": "#FFD93D",
  "sunset-4": "#FF8C42",
  "sunset-5": "#C9484B",
}

Об этой палитре

Палитра Закат (Sunset) — подобранный набор из 5 цветов с HEX, RGB и готовым экспортом в CSS-переменные и Tailwind. Нажмите на любой свотч для подробностей цвета — конвертаций, контраста и гармоний.

Читаемый текст на каждом цвете

Белый и почти чёрный измерены на каждом свотче. AA значит, что пара берёт 4,5:1 для основного текста; «Только крупный» — что берёт лишь 3:1, и годится от 24px.

#FF6B6BПочти чёрный6.81:1AA

#FFA07AПочти чёрный9.50:1AA

#FFD93DПочти чёрный13.72:1AA

#FF8C42Почти чёрный8.17:1AA

#C9484BБелый4.65:1AA

Эти цвета друг на друге

Ни одно из 20 сочетаний внутри палитры не дотягивает до 4,5:1 — сочетайте её цвета с белым или почти чёрным, а не друг с другом.

текст \\ фон	#FF6B6B	#FFA07A	#FFD93D	#FF8C42	#C9484B
#FF6B6B	·	1.40Не проходит	2.01Не проходит	1.20Не проходит	1.68Не проходит
#FFA07A	1.40Не проходит	·	1.44Не проходит	1.16Не проходит	2.34Не проходит
#FFD93D	2.01Не проходит	1.44Не проходит	·	1.68Не проходит	3.38Только крупный
#FF8C42	1.20Не проходит	1.16Не проходит	1.68Не проходит	·	2.01Не проходит
#C9484B	1.68Не проходит	2.34Не проходит	3.38Только крупный	2.01Не проходит	·

Ещё палитры

Смотрите также

Градиенты в той же гамме

Рассвет Персик Карамель