Skip to content

ridemountainpig/hue

Repository files navigation

CleanShot 2024-08-31 at 15 58 09@2x

Hue Palette

Hue Palette is a tool designed to help developers and designers effortlessly create custom hue palettes for their projects. With a user-friendly interface and powerful features, Hue Palette makes it easy to generate, preview, and use hue colors in your design and development workflows.

Features

  • Pre-built Hue Samples: Explore a wide range of pre-built hue samples to find the perfect color scheme for your project.
  • Custom Hue Generator: Easily generate custom hues tailored to your specific needs with the intuitive hue generator tool.
  • Tailwind CSS Integration: Instantly generate Tailwind CSS configuration code for the hues you create, allowing for seamless integration into your projects.

Getting Started

Visit the Application

To get started, visit Hue Palette and explore the available hue samples or start generating your custom hues.

Creating a Hue Palette

  1. Explore Samples: Browse through the pre-built hue samples to see if any fit your project's needs.
  2. Generate Custom Hues: Use the Hue Generator to create your own palette by selecting a base hue and adjusting the parameters to suit your design requirements.
  3. Preview: See a live preview of your hue palette as you make adjustments.
  4. Export: Once you're satisfied with your palette, export the Tailwind CSS configuration code provided for easy implementation in your project.

Using with Tailwind CSS

After generating your hue palette, you can quickly integrate it into your Tailwind CSS setup:

  1. Copy the generated Tailwind config code.
  2. Paste the code into your tailwind.config.js file.
  3. Start using your custom hues in your CSS classes.

Example:

module.exports = {
    theme: {
        extend: {
            colors: {
                // Your custom hue palette here
            },
        },
    },
};