Skip to content

Hue Rotate is a React application that allows users to select an initial color and a desired color, then calculates the CSS hue-rotate filter value required to transition between these colors.

Notifications You must be signed in to change notification settings

jjcxdev/hue-rotate

Repository files navigation

Hue Rotate

Hue Rotate is a React application that allows users to select an initial color and a desired color, then calculates the CSS hue-rotate filter value required to transition between these colors.

Features

  • Select initial and desired colors using HEX, RGB, or HSL formats.
  • View the calculated hue rotation angle.
  • Copy the hue rotation value to the clipboard with a single click.
  • Responsive design for use on various devices and screen sizes.

Usage

To use the application, follow these steps:

  1. Input the initial color in any CSS-supported format (HEX, RGB, HSL).
  2. Input the desired color in any CSS-supported format.
  3. View the calculated hue-rotate value displayed.
  4. Click the copy icon next to the hue rotation value to copy it to the clipboard.
  5. Use this value in your CSS to apply the hue-rotate filter to an element.

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

Acknowledgments

  • React documentation
  • Tailwind CSS for styling
  • chroma.js for color calculations

About

Hue Rotate is a React application that allows users to select an initial color and a desired color, then calculates the CSS hue-rotate filter value required to transition between these colors.

Resources

Stars

Watchers

Forks