AGMAD TOOLS
One color. Three ways.
Pick a color or enter its HEX value. Get matching HEX, RGB and HSL values, ready to copy into CSS.
Six digits after #, for example #336699. No alpha channel.
Choose, convert, copy
- Use the browser’s color picker, or type a six-digit HEX value and select Apply HEX. Pressing Enter in the input also applies it.
- Read the three synchronized CSS values. Invalid HEX leaves the previous valid outputs unchanged and shows an error.
- Copy the format you need. If clipboard access fails, the output is selected for manual copying. Reset returns to the initial example color, #7289da.
What the values mean
HEX encodes red, green and blue as two hexadecimal digits each. RGB shows channels from 0 to 255. HSL shows hue in degrees and saturation/lightness in percent. For example, #ff0000 maps to rgb(255, 0, 0) and hsl(0, 100%, 50%).
Rounding and limitations
This release keeps the legacy RGB-to-HSL math and rounds HSL components to whole numbers. Copying rounded HSL can introduce a small channel difference when converted back. Black, white and gray use hue 0 and saturation 0. This tool accepts only opaque six-digit HEX, not shorthand, alpha, Display-P3 or other wide-gamut formats. Native picker controls vary by browser and device.
A color value alone does not establish accessible text contrast. Check the foreground/background pair separately. This release does not extract palettes from images or promise identical appearance across displays.
Release note
Version 1.0.0 extracts the legacy AGMAD Color Picker into an independent bilingual plugin. The HEX → RGB → rounded HSL conversion is preserved. Added validated HEX entry, explicit CSS output syntax, reset, unique copy labels and clipboard error handling. Color values remain left-to-right inside the Arabic RTL interface.