{"$schema":"https://toolsly.tools/schemas/tool-manifest-v1.json","generated":"2026-06-02T15:45:19.841Z","discovery":{"catalog":"https://toptool.io/tools.json","llmsTxt":"https://toptool.io/llms.txt","sitemap":"https://toptool.io/sitemap.xml"},"relatedTools":[{"slug":"complementary-color","name":"Complementary Color Generator","url":"https://toptool.io/complementary-color"},{"slug":"random-color","name":"Random Color Generator","url":"https://toptool.io/random-color"},{"slug":"color-name-finder","name":"Color Name Finder","url":"https://toptool.io/color-name-finder"},{"slug":"material-palette","name":"Material Design Palette Generator","url":"https://toptool.io/material-palette"},{"slug":"tailwind-palette-extractor","name":"Tailwind Palette Extractor","url":"https://toptool.io/tailwind-palette-extractor"},{"slug":"hsv-color-picker","name":"HSV Color Picker","url":"https://toptool.io/hsv-color-picker"},{"slug":"color-converter","name":"Color Converter","url":"https://toptool.io/color-converter"},{"slug":"triadic-colors","name":"Triadic Colors Generator","url":"https://toptool.io/triadic-colors"}],"kind":"utility","slug":"tailwind-color-finder","name":"Tailwind Color Finder","description":"Find the closest Tailwind v3 utility class (e.g. bg-emerald-600) for any hex / rgb / hsl color.","longDescription":"Paste any hex / rgb / hsl color and find the closest Tailwind v3 default-palette utility — out of 242 (22 hues × 11 shades from 50 through 950). Returns the closest class name, the corresponding Tailwind hex, and a ranked list of the top 5 nearest candidates so you can pick the best fit. The distance metric is Euclidean in RGB space — fast and accurate enough for matching at this resolution. The full 242-color list is bundled inline; no external dependency on a Tailwind install. Output includes ready-to-paste `bg-*` and `text-*` class names.","category":"color","categoryName":"Color","keywords":["tailwind color finder","tailwind color picker","hex to tailwind class","rgb to tailwind class","closest tailwind color","tailwind palette lookup","tailwind utility finder","tailwind class generator","tailwind hex match","find tailwind color from hex","tailwind cheatsheet color","tailwind v3 colors"],"badge":"Lookup","url":"https://toptool.io/tailwind-color-finder","inputs":[{"type":"text","key":"color","label":"Color","placeholder":"#3b82f6","defaultValue":"#3b82f6","monospace":true,"help":"Hex, rgb(), hsl(), or a CSS color name."}],"outputs":[{"key":"preview","label":"Input preview","multiline":true},{"key":"bgClass","label":"Closest bg- class"},{"key":"textClass","label":"Closest text- class"},{"key":"borderClass","label":"Closest border- class"},{"key":"hexMatch","label":"Tailwind hex"},{"key":"delta","label":"Distance"},{"key":"candidates","label":"Top 5 candidates","multiline":true}],"invocation":{"webUi":"https://toptool.io/tailwind-color-finder","api":null,"notes":"Currently invoked via the web UI at `webUi`. Inputs are form fields; outputs are structured text values. A remote MCP/REST API is planned."}}