Skip to content

jjcxdev/hue-rotate

main
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 

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