This tool makes it easy to create, adjust, and experiment with custom colors for the web. It also makes it easy to convert between various color formats supported by CSS, including: HEXA colors, RGB (Red/Green/Blue) and HSL (Hue/Saturation/Lightness). Control over the alpha channel is also supported.
As you adjust the parameters that define the color, it gets displayed in all three standard Web CSS formats. In addition, based on the currently-selected color, a palette for HSL and HSV, as well as alpha, is generated. The "eyedropper" style color picker box can be toggled between HSL or HSV format. You can also test colors and how they overlap one another by dragging them into the box at the bottom of the tool and moving them over one another. Adjust their relative Z index values to move them forward and behind one another.
This tool will help you identify the perfect CSS colors to apply to your HTML.
The generated colors you create above can be used anywhere color is used in CSS and HTML, unless otherwise noted.
For more on using color, see:
- Applying color to HTML elements using CSS
- Fundamental text and font styling
- Styling borders using CSS
- Changing background styles using CSS
- Color and color contrast
For additional tools, see:
- Border-image generator
This interactive tool lets you visually create border images (the
- Border-radius generator
This interactive tool lets you visually create rounded corners (the
- Box-shadow generator
This interactive tool lets you visually create shadows behind elements (the