Learn to define colors precisely and ensure good contrast.
Know when to use hex, rgb and hsl.
Hex is common in visual design, RGB is useful for manipulation and HSL for hue and light adjustments.
If you need to vary a color in a controlled way, HSL is often the best choice.
Avoid loose colors and build consistency.
Define base colors in :root and reuse them in buttons, backgrounds and texts.
This way you can adjust the visual identity from a single place.
Good color also reads well.
Sufficient contrast improves reading and accessibility.
Avoid light gray text on light backgrounds: it looks elegant but reads poorly.
Visualizes how to adjust color more intuitively than with hex values.
