رفتن به انتخابگر رنگ

API رایگان رنگ

رنگ‌ها را تجزیه و تبدیل کنید، کنتراست را بررسی کنید، مقیاس و پالت رنگ بسازید، کوررنگی را شبیه‌سازی کنید و توکن‌های طراحی را از طریق HTTP ساده خروجی بگیرید. بدون کلید، بدون ثبت‌نام، ورودی و خروجی JSON.

  • بدون کلید API و بدون ثبت‌نام
  • GET با پارامترهای کوئری یا POST با JSON
  • CORS فعال است، از هر سایتی فراخوانی کنید
  • همان محاسبات سایت: CSS Color 4
مشخصات OpenAPI 3.1از دستیار هوش مصنوعی استفاده می‌کنید؟ به‌جای آن سرور MCP را وصل کنید

اندپوینت‌ها

  • Describe a color

    GET, POST /api/v1/parse-color

    Read any color and describe it: HEX, RGB, HSL and OKLCH values, the closest human name, the closest Tailwind class, its hue family, whether it fits sRGB and Display P3, and which text color, white or black, reads better on it.

    امتحان کنید: /api/v1/parse-color?color=oklch%2862%25+0.21+260%29

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/parse-color \
  -H 'Content-Type: application/json' \
  -d '{"color":"oklch(62% 0.21 260)"}'

  • Convert a color

    GET, POST /api/v1/convert-color

    Convert a color between formats: hex, rgb, hsl, hsv, hwb, cmyk, lab, lch, oklab, oklch, display-p3, rec2020, xyz and platform code (swiftui, uikit, flutter, android). Values follow CSS Color 4.

    امتحان کنید: /api/v1/convert-color?color=%23ff5733&formats=oklch%2Chsl%2Ccmyk

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/convert-color \
  -H 'Content-Type: application/json' \
  -d '{"color":"#ff5733","formats":["oklch","hsl","cmyk"]}'

  • Find colors by name

    GET, POST /api/v1/find-colors

    Search color names by words, like "sage", "dusty rose", "midnight blue" or "бордовый", and get their HEX values. Searches common names in English and Russian and about 30 000 extended color names. Use it to turn a description into real colors.

    امتحان کنید: /api/v1/find-colors?query=sage&limit=5

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/find-colors \
  -H 'Content-Type: application/json' \
  -d '{"query":"sage","limit":5}'

  • Check text contrast

    GET, POST /api/v1/check-contrast

    Check text contrast against a background with both WCAG 2 (ratio, AA and AAA for normal and large text) and APCA (Lc value and the usage level it allows). Also suggests the nearest text color that passes AA and AAA while keeping its hue.

    امتحان کنید: /api/v1/check-contrast?text=%236b7280&background=%23ffffff

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/check-contrast \
  -H 'Content-Type: application/json' \
  -d '{"text":"#6b7280","background":"#ffffff"}'

  • Fix contrast

    GET, POST /api/v1/fix-contrast

    Find the closest color that reaches a contrast target by changing only OKLCH lightness, so the hue and character stay. Targets: aa (4.5:1), aa-large (3:1), aaa (7:1), apca-body (Lc 75), apca-content (Lc 60), apca-large (Lc 45). Adjust the text color or the background.

    امتحان کنید: /api/v1/fix-contrast?text=%23f97316&background=%23ffffff&target=aa&adjust=text

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/fix-contrast \
  -H 'Content-Type: application/json' \
  -d '{"text":"#f97316","background":"#ffffff","target":"aa","adjust":"text"}'

  • Audit a palette for accessibility

    GET, POST /api/v1/audit-palette

    Check every text and background pair in a palette with WCAG 2 and APCA, list which pairs are safe for body text, large text or only decoration, find colors that people with color blindness cannot tell apart, and flag colors outside sRGB. Use it before shipping a theme or chart palette.

    امتحان کنید: /api/v1/audit-palette?colors=%230f172a%2C%23f8fafc%2C%232563eb%2C%23f97316%2C%2316a34a

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/audit-palette \
  -H 'Content-Type: application/json' \
  -d '{"colors":["#0f172a","#f8fafc","#2563eb","#f97316","#16a34a"]}'

  • Check gamut

    GET, POST /api/v1/check-gamut

    Check whether a color fits the sRGB, Display P3 and Rec. 2020 gamuts, and get the closest sRGB fallback that keeps lightness and hue (CSS Color 4 gamut mapping in OKLCH).

    امتحان کنید: /api/v1/check-gamut?color=oklch%2870%25+0.3+145%29

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/check-gamut \
  -H 'Content-Type: application/json' \
  -d '{"color":"oklch(70% 0.3 145)"}'

  • Find color names

    GET, POST /api/v1/nearest-names

    Find the closest named colors, CSS color keywords and Tailwind CSS classes for a color, ranked by perceptual distance (deltaE OK).

    امتحان کنید: /api/v1/nearest-names?color=%231e3a8a&limit=3

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/nearest-names \
  -H 'Content-Type: application/json' \
  -d '{"color":"#1e3a8a","limit":3}'

  • Compare two colors

    GET, POST /api/v1/compare-colors

    Compare two colors: CIEDE2000 and deltaE OK difference with a plain verdict (identical, nearly, similar, different, opposite), lightness shift in percent, chroma and hue shift, and the contrast between them.

    امتحان کنید: /api/v1/compare-colors?first=teal&second=turquoise

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/compare-colors \
  -H 'Content-Type: application/json' \
  -d '{"first":"teal","second":"turquoise"}'

  • Generate a 50–950 scale

    GET, POST /api/v1/generate-scale

    Build an 11-step tint and shade scale (50, 100 … 900, 950) from one color in OKLCH, the same shape as Tailwind palettes, with even perceived lightness steps.

    امتحان کنید: /api/v1/generate-scale?color=%233b82f6

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/generate-scale \
  -H 'Content-Type: application/json' \
  -d '{"color":"#3b82f6"}'

  • Tints, shades and tones

    GET, POST /api/v1/tints-shades

    Get tints (mixed with white), shades (mixed with black) and tones (mixed with gray) of a color, evenly spaced, as HEX. Good for hover states, borders and backgrounds.

    امتحان کنید: /api/v1/tints-shades?color=%232563eb&steps=5

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/tints-shades \
  -H 'Content-Type: application/json' \
  -d '{"color":"#2563eb","steps":5}'

  • Color harmonies

    GET, POST /api/v1/harmonies

    Get color harmonies for a base color, computed in OKLCH so lightness stays even: complementary, split-complementary, analogous, triadic, tetradic, square and monochromatic.

    امتحان کنید: /api/v1/harmonies?color=%23ff5733&kind=triadic

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/harmonies \
  -H 'Content-Type: application/json' \
  -d '{"color":"#ff5733","kind":"triadic"}'

  • Mix two colors

    GET, POST /api/v1/mix-colors

    Mix two colors at a ratio in a chosen color space, like CSS color-mix(). OKLab keeps the middle bright, sRGB tends to turn gray. Returns the result and a ready color-mix() expression.

    امتحان کنید: /api/v1/mix-colors?first=%23ff5733&second=%233b82f6&amount=30&space=oklab

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/mix-colors \
  -H 'Content-Type: application/json' \
  -d '{"first":"#ff5733","second":"#3b82f6","amount":30,"space":"oklab"}'

  • Make a CSS gradient

    GET, POST /api/v1/make-gradient

    Build a CSS gradient from 2 or more colors with interpolation in OKLab, OKLCH or sRGB. Returns modern CSS with the color space, a fallback with precomputed stops for older browsers, and the stop colors. OKLab avoids the gray middle that sRGB gradients get.

    امتحان کنید: /api/v1/make-gradient?colors=%232563eb%2C%23f97316&kind=linear&angle=90&space=oklab

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/make-gradient \
  -H 'Content-Type: application/json' \
  -d '{"colors":["#2563eb","#f97316"],"kind":"linear","angle":90,"space":"oklab"}'

  • Generate a palette

    GET, POST /api/v1/generate-palette

    Generate a harmonious palette in OKLCH. Keep colors you already have, pick a style (auto, analogous, complementary, triadic, monochromatic, pastel, vivid, muted, dark) and pass a seed to get the same palette every time.

    امتحان کنید: /api/v1/generate-palette?keep=%230f172a&mode=analogous&size=5&seed=brand

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/generate-palette \
  -H 'Content-Type: application/json' \
  -d '{"keep":["#0f172a"],"mode":"analogous","size":5,"seed":"brand"}'

  • Simulate color blindness

    GET, POST /api/v1/simulate-cvd

    Show how colors look with protanopia, deuteranopia, tritanopia and achromatopsia (Machado 2009 at full severity), and list the pairs that become hard to tell apart.

    امتحان کنید: /api/v1/simulate-cvd?colors=%23e11d48%2C%2316a34a%2C%232563eb

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/simulate-cvd \
  -H 'Content-Type: application/json' \
  -d '{"colors":["#e11d48","#16a34a","#2563eb"]}'

  • Export colors as code

    POST /api/v1/export-tokens

    Turn a list of colors into ready code: CSS custom properties, a Tailwind v4 @theme block, SCSS variables, JSON, W3C design tokens (DTCG), a JavaScript array or an SVG swatch strip. Unnamed colors get their closest color name.

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/export-tokens \
  -H 'Content-Type: application/json' \
  -d '{"colors":[{"color":"#0f172a","name":"ink"},{"color":"#f97316"}],"format":"tailwind","values":"oklch"}'

  • Build a design system

    GET, POST /api/v1/build-system

    Build a full color system from a brand color: 50–950 scales for primary, secondary, accent, neutral and status colors, light and dark theme roles, exported as a Tailwind v4 theme, CSS variables, shadcn/ui globals.css or DTCG tokens, with a contrast audit of text and surface pairs.

    امتحان کنید: /api/v1/build-system?primary=%236d4aff&format=shadcn

    بدنه POST

    curl -X POST https://pickshade.com/api/v1/build-system \
  -H 'Content-Type: application/json' \
  -d '{"primary":"#6d4aff","format":"shadcn"}'

محدودیت‌ها

هر نشانی IP می‌تواند حدود 10 درخواست در ثانیه همراه با جهش‌های کوتاه بفرستد. بیش از آن، API با کد 429 و هدر Retry-After پاسخ می‌دهد. نتیجه‌هایی که هرگز تغییر نمی‌کنند یک روز کش می‌شوند، پس فراخوانی‌های تکراری فوری هستند.

پرسش و پاسخ

آیا به کلید API نیاز دارم؟

خیر. API رایگان و باز است. کافی است اندپوینت‌ها را از طریق HTTPS از سرور، یک اسکریپت یا مرورگر فراخوانی کنید.

چه فرمت‌های رنگی را می‌پذیرد؟

هر رنگ CSS: HEX، rgb()، hsl()، hwb()، lab()، lch()، oklab()، oklch() و color(display-p3 …)، به‌علاوه نام‌های CSS مثل navy، نام‌های رایج مثل royal blue و کلاس‌های Tailwind مثل sky-500.

خطاها چطور گزارش می‌شوند؟

خطاها با application/problem+json و همراه با یک title و یک detail برمی‌گردند که می‌گوید چه چیزی را باید اصلاح کنید، برای مثال وقتی یک رشته را نمی‌توان به‌عنوان رنگ خواند.