Color Converter and Contrast Checker

Convert interface colors between HEX, RGB, and HSL, then check text and background contrast for WCAG readability.

Reference

Color Conversion notes

What is Color Conversion?

Color conversion changes a color between formats such as HEX, RGB, and HSL. Contrast checking measures readability between foreground and background colors.

How does the Color Conversion tool work?

The tool parses HEX colors, converts RGB values into HEX and HSL, computes relative luminance, and calculates the WCAG contrast ratio between two colors.

When should you use Color Conversion?

  • Converting design tokens between HEX, RGB, and HSL
  • Checking text contrast for UI accessibility
  • Testing dark theme foreground and background colors
  • Preparing CSS color values for implementation

What are the limitations of Color Conversion?

  • Only HEX input is currently parsed
  • Contrast checks do not replace full accessibility review
  • Alpha transparency and color spaces beyond sRGB are not included

Color Conversion examples

hex #5ee0b5 -> rgb(94, 224, 181)
contrast #5ee0b5 on #090d10 -> WCAG contrast ratio
hsl #ff8c42 -> hsl(...)
Keep working

Other tools

Security & Identity
JWT Decoder and Encoder Decode JWT tokens, inspect JSON payloads, verify signatures with a secret, and generate HS256 tokens locally in your browser.
Automation & Patterns
Cron Expression Builder Build readable cron expressions for scheduled jobs and translate minute, hour, day, month, and weekday fields into plain English.
Data & Encoding
Base64 Encoder and Decoder Encode text or images to Base64, decode Base64 strings back to readable text, and preview image data URLs in the browser.
Data & Encoding
JSON Formatter & Validator Format, validate, pretty print, and minify JSON data in your browser for API responses, configuration files, and debugging.
Data & Encoding
JSON to TypeScript Interface Generator Convert JSON objects into TypeScript interfaces and generate sample JSON from simple TypeScript interfaces in your browser.
Security & Identity
UUID v4, v7 and v5 Generator Generate UUID v4, sortable UUID v7, namespace UUID v3/v5, GUID, URN, and hyphenless identifiers, then validate UUID strings locally.
Sharing
Custom QR Code Generator Create custom QR codes for URLs, Wi-Fi, vCard, email, SMS, events, and locations with a logo, gradients, module shapes, contrast check, and PNG, SVG, JPEG, or WebP export.
Security & Identity
Hash Generator Generate SHA-1, SHA-256, SHA-384, SHA-512, and BCrypt hashes from text for checksums, password hashing, and integrity checks.
Automation & Patterns
Regex Tester & Debugger Test, debug and replace with regular expressions. Supports Match/Test/Replace modes, positional and named groups, replacement patterns ($1, $&), global matching and detailed match reports.
Security & Identity
Password Generator Generate secure random passwords with customizable length, uppercase, lowercase, digits, and symbols for strong credentials.
Data & Encoding
URL Encoder and Decoder Encode and decode URLs, query strings, and text safely for web requests, links, and browser navigation.
Data & Encoding
Timestamp Converter Convert Unix timestamps, ISO dates, local time, UTC time, and timezone offsets directly in your browser.
Data & Encoding
YAML Formatter and YAML to JSON Format simple YAML, convert YAML to JSON, and convert JSON back to readable YAML for configs and manifests.
Text & Documents
Text and JSON Diff Checker Compare two text or JSON snippets side by side and review added, removed, and changed lines locally.
Network & Web
HTTP Headers Analyzer Parse HTTP headers into a table and highlight cache, security, CORS, and content negotiation signals.
Network & Web
CIDR and IP Subnet Calculator Calculate IPv4 network ranges, masks, usable hosts, broadcast addresses, and CIDR prefix details.
Network & Web
User Agent Parser Parse browser user agent strings into browser, engine, operating system, device, and bot hints.
Text & Documents
SQL Formatter Format SQL queries with readable indentation, keyword casing, and line breaks for debugging and reviews.
Text & Documents
Markdown Preview Preview Markdown as HTML, inspect generated markup, and copy rendered HTML without sending text to a server.
Data & Encoding
HTML Entity Encoder and Decoder Encode text as HTML entities, decode entities back to text, and safely prepare snippets for markup.