Чтобы получить противоположный (дополнительный) цвет в шестнадцатеричном формате с помощью JavaScript, вы можете использовать несколько методов. Вот некоторые из них:

Метод 1: инвертирование значений RGB

• Преобразуйте шестнадцатеричный цвет в его представление RGB.
• Вычтите каждый компонент RGB из 255.
• Преобразуйте инвертированные значения RGB обратно в шестнадцатеричные.

Вот пример реализации:

function getOppositeHexColor(hexColor) {
  // Remove the # symbol if present
  hexColor = hexColor.replace("#", "");
  // Convert hex to RGB
  var r = parseInt(hexColor.substr(0, 2), 16);
  var g = parseInt(hexColor.substr(2, 2), 16);
  var b = parseInt(hexColor.substr(4, 2), 16);
  // Invert the RGB values
  r = 255 - r;
  g = 255 - g;
  b = 255 - b;
  // Convert RGB to hex
  var invertedHexColor = "#" + ((r << 16) | (g << 8) | b).toString(16).padStart(6, "0");
  return invertedHexColor;
}
// Usage example
var oppositeColor = getOppositeHexColor("#FF0000");
console.log(oppositeColor); // Outputs "#00FFFF"

Метод 2. Использование цветовой модели HSL

• Преобразуйте шестнадцатеричный цвет в его представление RGB.
• Преобразуйте значения RGB в цветовую модель HSL.
• Добавьте 180 градусов к значению оттенка.
• Преобразуйте измененные значения HSL обратно в RGB.
• Преобразуйте значения RGB обратно в шестнадцатеричные.

Вот пример реализации с использованием библиотеки tinycolor:

// Install the tinycolor library using npm: npm install tinycolor2
const tinycolor = require("tinycolor2");
function getOppositeHexColor(hexColor) {
  var color = tinycolor(hexColor);
  var hsl = color.toHsl();
  // Add 180 degrees to the hue value
  hsl.h += 180;
  hsl.h = hsl.h > 360 ? hsl.h - 360 : hsl.h;
  // Convert modified HSL back to RGB
  var oppositeColor = tinycolor(hsl).toRgb();
  // Convert RGB to hex
  var invertedHexColor = tinycolor(oppositeColor).toHex();
  return invertedHexColor;
}
// Usage example
var oppositeColor = getOppositeHexColor("#FF0000");
console.log(oppositeColor); // Outputs "#00FFFF"