Цвет фуксии Fuchsia #FF00FF

Где использовать цвет фуксии

Цвет фуксии #FF00FF состоит из максимальных красного и синего каналов без зелёного. В CSS значения fuchsia и magenta являются полными синонимами и ведут на один и тот же оттенок.

Характер и восприятие

Фуксия выглядит яркой, цифровой и эмоциональной. Она моментально привлекает внимание и лучше подходит небольшим акцентам, чем большим фоновым областям.

Подходящие задачи

• Яркие CTA, метки и экспериментальные интерфейсы.
• Творческие, fashion- и событийные проекты.
• Градиенты с фиолетовым, синим и розовым.

Практические рекомендации

• Используйте фуксию дозированно.
• Проверяйте контраст текста и не полагайтесь только на цвет.
• Для больших поверхностей уменьшайте насыщенность или светлоту.

Как задать цвет фуксии в HTML и CSS

В современной HTML-странице цвет оформляют через CSS. Для одного и того же оттенка можно использовать HEX-код, функции RGB и HSL или именованное значение fuchsia.

У этого оттенка несколько равнозначных CSS-названий: fuchsia и magenta. Они дают одинаковый результат и ведут на одну страницу.

.example {
  color: #000000;
  background-color: #ff00ff;
}

Если значение понадобится в нескольких компонентах, вынесите его в CSS-переменную:

:root {
  --color-fuksiya: #ff00ff;
}

.button {
  background: var(--color-fuksiya);
}