Explorando a Conversão de Cores HSB para RGB

Beginner

This tutorial is from open-source community. Access the source code

Introdução

Neste laboratório, exploraremos o processo de conversão de cores HSB para RGB usando JavaScript. Aprenderemos como converter valores de cor HSB para o formato RGB usando uma fórmula e converter a saída para a faixa apropriada de valores. Ao final do laboratório, você terá uma melhor compreensão dos modelos de cores e como trabalhar com eles em JavaScript.

Conversão de HSB para RGB

Para converter uma tupla de cores HSB para o formato RGB, siga estes passos:

  • Abra o Terminal/SSH e digite node para começar a praticar a codificação.
  • Use a fórmula de conversão de HSB para RGB para converter para o formato apropriado.
  • Os parâmetros de entrada devem estar na faixa de H: [0, 360], S: [0, 100], B: [0, 100].
  • Todos os valores de saída devem estar na faixa de [0, 255].

Aqui está o código que você pode usar para converter HSB para RGB:

const HSBToRGB = (h, s, b) => {
  s /= 100;
  b /= 100;
  const k = (n) => (n + h / 60) % 6;
  const f = (n) => b * (1 - s * Math.max(0, Math.min(k(n), 4 - k(n), 1)));
  return [255 * f(5), 255 * f(3), 255 * f(1)];
};

Por exemplo, se você deseja converter a tupla de cores HSB (18, 81, 99) para o formato RGB, você pode usar o seguinte código:

HSBToRGB(18, 81, 99); // [252.45, 109.31084999999996, 47.965499999999984]

Resumo

Parabéns! Você concluiu o laboratório de HSB para RGB. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.