DevOps Lounge Join
Tools

Color and contrast

Type any color to get HEX, RGB, HSL and OKLCH, check its contrast against a background for WCAG, and pick a lighter or darker shade.

    Join the serverThe quick brown fox jumps over the lazy dog.
      Shades of the text color

      How it works

      • Any format inNames like navy, hex, rgb(), hsl(), oklch() and more are read by your browser's own color engine.
      • WCAG levelsBody text needs 4.5:1 for AA and 7:1 for AAA. Large or bold text needs 3:1 for AA.

      Questions

      What is OKLCH?

      A color format where lightness matches how bright colors look to people, which makes building palettes easier.

      Which level should I aim for?

      AA for everything, and AAA for long reading text when you can.

      More tools

      Built something with it?

      Show it in the server, get a code review, or ask the people who use these tools every day.

      Join on Discord