ਰੰਗ ਚੋਣਕਾਰ ਅਤੇ ਪਹੀਆ
ਰੰਗ ਮੇਲ
Grab the exact color from any image
Stop guessing HEX codes from screenshots. Click any pixel for HEX, RGB, and HSL, or extract the dominant palette as JSON or CSS variables, right in your browser.
Drop an image — click any pixel for its code or extract the full palette
PNG, JPG, WEBP, GIF
What you can do with ਕਲਰ ਪਿਕਰ
Everything this tool helps you accomplish — no learning curve, no setup.
- Pick any color from a photo as HEX, RGB or HSL
- Extract the dominant color palette from an image
- Grab brand colors from a screenshot or logo
- Copy color codes for your designs
- Export the palette as JSON or CSS variables
- Build a color scheme from a reference photo
Settings information
8 settings
Every control in ਕਲਰ ਪਿਕਰ, explained — what it does and when to use it.
ਰੰਗ ਚੋਣਕਾਰ ਅਤੇ ਪਹੀਆ
- ਬੇਤਰਤੀਬOne-click
- ਇੱਕ ਕਲਿੱਕ ਵਿੱਚ ਨਵਾਂ ਬੇਤਰਤੀਬ ਰੰਗ ਲੈ ਆਉਂਦਾ ਹੈ ਤਾਂ ਜੋ ਝੱਟ ਪ੍ਰੇਰਨਾ ਮਿਲੇ; HEX, RGB, HSL ਮੁੱਲ ਅਤੇ ਹਾਰਮਨੀ ਪੈਲੇਟ ਸਾਰੇ ਨਾਲੋ-ਨਾਲ ਅੱਪਡੇਟ ਹੋ ਜਾਂਦੇ ਹਨ।
- ਸੰਤ੍ਰਿਪਤਾ ਅਤੇ ਚਮਕSliderRange: 0–100%
- ਰੰਗ ਕਿੰਨਾ ਚਮਕਦਾਰ ਹੋਵੇ (ਖੱਬੇ ਤੋਂ ਸੱਜੇ) ਅਤੇ ਕਿੰਨਾ ਹਲਕਾ ਜਾਂ ਗੂੜ੍ਹਾ ਹੋਵੇ (ਉੱਪਰ ਤੋਂ ਹੇਠਾਂ), ਇਹ ਤੈਅ ਕਰਨ ਲਈ ਵਰਗ ਉੱਤੇ ਮਾਰਕਰ ਖਿੱਚੋ।
- ਰੰਗਤSliderRange: 0–360 · ਮੂਲ: 211
- ਮੂਲ ਰੰਗਤ ਚੁਣਨ ਲਈ ਸਤਰੰਗੀ ਪੱਟੀ ਉੱਤੇ ਸਲਾਈਡ ਕਰੋ — ਲਾਲ ਤੋਂ ਪੀਲੇ, ਹਰੇ, ਨੀਲੇ ਤੇ ਮੈਜੈਂਟਾ ਹੁੰਦੇ ਹੋਏ ਵਾਪਸ ਲਾਲ ਤੱਕ।
- HEXText input
- ਕੋਈ ਵੀ ਰੰਗ ਮੁੱਲ ਟਾਈਪ ਕਰੋ ਜਾਂ ਪੇਸਟ ਕਰੋ — HEX ਕੋਡ, rgb() ਜਾਂ hsl() ਨੋਟੇਸ਼ਨ, ਜਾਂ CSS ਰੰਗ ਨਾਮ — ਅਤੇ ਸਿੱਧਾ ਉਸੇ ਸਟੀਕ ਰੰਗ ਉੱਤੇ ਪਹੁੰਚ ਜਾਓ।
- RGBNumber inputRange: 0–255
- ਜਦੋਂ ਤੁਹਾਨੂੰ ਡਿਜ਼ਾਈਨ ਸਪੈਸੀਫ਼ਿਕੇਸ਼ਨ ਵਿੱਚੋਂ ਸਹੀ RGB ਮੁੱਲ ਨਾਲ ਮੇਲ ਕਰਨਾ ਹੋਵੇ, ਤਾਂ ਲਾਲ, ਹਰੇ ਤੇ ਨੀਲੇ ਚੈਨਲ ਵੱਖ-ਵੱਖ 0 ਤੋਂ 255 ਤੱਕ ਸੈੱਟ ਕਰੋ।
- HSLNumber inputRange: 0–360
- ਰੰਗਤ (0–360) ਦੇ ਨਾਲ-ਨਾਲ ਸੰਤ੍ਰਿਪਤਾ ਅਤੇ ਲਾਈਟਨੈੱਸ (0–100) ਨੂੰ ਅੰਕਾਂ ਵਜੋਂ ਸੈੱਟ ਕਰੋ — ਰੰਗਤ ਬਦਲੇ ਬਿਨਾਂ ਕਿਸੇ ਰੰਗ ਨੂੰ ਥੋੜ੍ਹਾ ਹਲਕਾ ਜਾਂ ਮੱਧਮ ਕਰਨ ਲਈ ਲਾਹੇਵੰਦ।
ਪ੍ਰਮੁੱਖ ਪੈਲੇਟ
- ਆਕਾਰDropdown
- ਅੱਪਲੋਡ ਕੀਤੇ ਚਿੱਤਰ ਵਿੱਚੋਂ ਕਿੰਨੇ ਮੁੱਖ ਰੰਗ ਕੱਢਣੇ ਹਨ, ਇਹ ਚੁਣਦਾ ਹੈ (ਮੂਲ 8); ਸਾਫ਼-ਸੁਥਰੇ ਬ੍ਰਾਂਡ ਪੈਲੇਟ ਲਈ ਛੋਟੀ ਗਿਣਤੀ ਚੁਣੋ ਜਾਂ ਹਲਕੇ ਐਕਸੈਂਟ ਸ਼ੇਡ ਸਾਹਮਣੇ ਲਿਆਉਣ ਲਈ ਵੱਡੀ।ਚੋਣਾਂ: 58101624
- ਚੁਣਿਆ ਰੰਗColor picker
- ਉਸ ਪਿਕਸਲ ਦਾ ਰੰਗ ਲੈਣ ਲਈ ਅੱਪਲੋਡ ਕੀਤੀ ਫ਼ੋਟੋ 'ਤੇ ਕਿਤੇ ਵੀ ਕਲਿੱਕ ਜਾਂ ਟੈਪ ਕਰੋ; ਹਰ ਚੋਣ HEX, RGB ਅਤੇ HSL ਕੀਮਤਾਂ ਵਾਲਾ ਸਵੈਚ ਜੋੜ ਦਿੰਦੀ ਹੈ, ਜਿਸ ਨੂੰ ਵੱਖਰੇ ਤੌਰ 'ਤੇ ਜਾਂ ਸਾਰੇ ਇਕੱਠੇ ਹਟਾਇਆ ਜਾ ਸਕਦਾ ਹੈ।
ਕਲਰ ਪਿਕਰ ਨਾਲ ਹੋ ਗਿਆ? ਅੱਗੇ ਇਹ ਅਜ਼ਮਾਓ
ਚੋਣਵੇਂ ਟੂਲ ਜੋ ਕਲਰ ਪਿਕਰ ਨਾਲ ਵਧੀਆ ਜੁੜਦੇ ਹਨ। ਆਪਣੀ ਫ਼ਾਈਲ ਗੁਆਏ ਬਿਨਾਂ ਅੱਗੇ ਵਧਦੇ ਰਹੋ।
ਕਲਰ ਪੈਲੇਟ ਜਨਰੇਟਰ
Picking colors that work together is slow guesswork. Press space to generate, lock what you like, and export PNG, CSS variables, or JSON in seconds.
ਹੁਣੇ ਅਜ਼ਮਾਓਕਲਰ ਵ੍ਹੀਲ
Guessing at matching colors leads to clashing designs. Drag the wheel to get complementary, analogous, triadic, tetradic and square harmonies with copyable hex codes — free, with no account needed.
ਹੁਣੇ ਅਜ਼ਮਾਓਰੰਗਾਂ ਦੇ ਅਰਥ
The wrong color sends the wrong message. Pick any color to see its psychology, symbolism, cultural meanings, brand examples and copyable pairings — free, with no account needed.
ਹੁਣੇ ਅਜ਼ਮਾਓEXIF ਵਿਊਅਰ ਅਤੇ ਰੀਮੂਵਰ
Photos carry GPS locations, device details, and timestamps you never meant to share. Inspect every EXIF, IPTC, and XMP field, then download a metadata-free copy in seconds.
ਹੁਣੇ ਅਜ਼ਮਾਓਫੋਟੋ ਫਿਲਟਰ ਅਤੇ ਇਫੈਕਟ
Flat photos get scrolled past. Pick a cinematic, vintage, glitch, or beauty effect, preview every look instantly, and download the one you love in seconds. Free to start, no credit card.
ਹੁਣੇ ਅਜ਼ਮਾਓਇਮੇਜ ਓਵਰਲੇ
Desktop compositing is overkill for placing a logo or watermark. Drag your overlay into position, tune opacity and blend, and download the combined image in seconds. Free to start.
ਹੁਣੇ ਅਜ਼ਮਾਓਅਕਸਰ ਪੁੱਛੇ ਜਾਂਦੇ ਸਵਾਲ
ਕੋਈ ਵੀ JPG, PNG, WebP ਜਾਂ GIF ਅੱਪਲੋਡ ਕਰੋ ਅਤੇ ਦਿਖਾਈ ਜਾ ਰਹੀ ਤਸਵੀਰ 'ਤੇ ਕਿਤੇ ਵੀ ਕਲਿੱਕ ਕਰੋ — ਤੁਹਾਡੇ ਕਰਸਰ ਹੇਠਲੇ ਠੀਕ ਪਿਕਸਲ ਦਾ ਨਮੂਨਾ ਲਿਆ ਜਾਂਦਾ ਹੈ ਅਤੇ HEX, RGB ਅਤੇ HSL ਵਜੋਂ ਦਿਖਾਇਆ ਜਾਂਦਾ ਹੈ, ਹਰ ਫਾਰਮੈਟ ਲਈ ਇੱਕ-ਕਲਿੱਕ ਕਾਪੀ ਨਾਲ। ਕਿਸੇ ਬ੍ਰਾਂਡ ਰੰਗ ਨਾਲ ਮੇਲ ਕਰਨ, ਫੋਟੋ ਤੋਂ ਸਵੈਚ ਲੈਣ, ਜਾਂ ਡਿਜ਼ਾਈਨ ਮੌਕਅੱਪ ਤੋਂ ਐਕਸੈਂਟ ਟੋਨ ਚੁੱਕਣ ਲਈ ਬਿਲਕੁਲ ਢੁਕਵਾਂ।
usageਕਿਸੇ ਵੀ ਪਿਕਸਲ 'ਤੇ ਕਲਿੱਕ ਕਰੋ ਤੇ ਇਹ ਕਲਰ ਪਿਕਰ ਟੂਲ ਉਸਦਾ HEX ਰੰਗ ਕੋਡ (ਜਿਵੇਂ #FF6B35) RGB ਤੇ HSL ਦੇ ਨਾਲ ਦਿਖਾਉਂਦਾ ਹੈ — ਉਹੀ HTML/CSS ਰੰਗ ਕੋਡ ਜੋ ਤੁਸੀਂ ਸਿੱਧਾ ਇੱਕ ਸਟਾਈਲਸ਼ੀਟ, ਡਿਜ਼ਾਈਨ ਟੋਕਨ ਜਾਂ HTML ਐਟ੍ਰੀਬਿਊਟ ਵਿੱਚ ਪੇਸਟ ਕਰਦੇ ਹੋ। ਇੱਕ ਕਲਿੱਕ ਵਿੱਚ ਹੈਕਸ ਕੋਡ ਲੈਣ ਲਈ Copy ਦਬਾਓ।
usageਚਿੱਤਰ ਨੂੰ ਇਸ ਦੇ ਸਭ ਤੋਂ ਲੰਬੇ ਪਾਸੇ ਉੱਤੇ 320 ਪਿਕਸਲ ਤੱਕ ਡਾਊਨਸੈਂਪਲ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਫਿਰ ਹਰ ਪਿਕਸਲ ਨੂੰ ਉਸ ਦੇ ਪ੍ਰਤੀ ਚੈਨਲ ਉੱਪਰਲੇ 4 ਬਿਟਾਂ ਅਨੁਸਾਰ ਬਕਟਾਂ ਵਿੱਚ ਪਾਇਆ ਜਾਂਦਾ ਹੈ। ਸਭ ਤੋਂ ਵੱਧ ਭਰੇ ਬਕਟਾਂ ਨੂੰ ਪੂਰੇ 8-ਬਿਟ ਰੰਗ ਵਿੱਚ ਔਸਤ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਬਾਰੰਬਾਰਤਾ ਅਨੁਸਾਰ ਛਾਂਟਿਆ ਜਾਂਦਾ ਹੈ, ਅਤੇ ਤੁਹਾਡੇ ਪੈਲੇਟ ਵਜੋਂ ਵਾਪਸ ਕੀਤਾ ਜਾਂਦਾ ਹੈ। ਨਤੀਜਾ ਆਮ ਤੌਰ 'ਤੇ 5-24 ਪ੍ਰਮੁੱਖ ਰੰਗ ਹੁੰਦੇ ਹਨ ਜੋ ਚਿੱਤਰ ਦਾ ਦ੍ਰਿਸ਼ਟੀਗਤ ਸਾਰ ਦਿੰਦੇ ਹਨ।
technicalਹਾਂ। Download ਬਟਨ ਦੋ ਫਾਰਮੈਟ ਬਣਾਉਂਦੇ ਹਨ: ਇੱਕ CSS ਵੇਰੀਏਬਲ ਬਲਾਕ ਜੋ :root ਸਿਲੈਕਟਰ (--color-1, --color-2…) ਵਿੱਚ ਪੇਸਟ ਕਰਨ ਲਈ ਤਿਆਰ ਹੈ, ਅਤੇ ਇੱਕ JSON ਫਾਈਲ ਜਿਸ ਵਿੱਚ ਹਰ ਰੰਗ ਲਈ ਹੈਕਸ, RGB ਭਾਗ ਅਤੇ ਭਾਰ ਪ੍ਰਤੀਸ਼ਤ ਹੁੰਦਾ ਹੈ। ਦੋਵੇਂ ਫਾਰਮੈਟ ਡਿਜ਼ਾਈਨ ਟੋਕਨਾਂ, Tailwind ਕਨਫਿਗਾਂ ਅਤੇ ਪੈਲੇਟ ਲਾਇਬ੍ਰੇਰੀਆਂ ਵਿੱਚ ਸਾਫ਼-ਸੁਥਰੇ ਢੰਗ ਨਾਲ ਜੁੜ ਜਾਂਦੇ ਹਨ।
featuresਨਹੀਂ — ਰੰਗ ਚੁਣਨਾ ਅਤੇ ਪੈਲੇਟ ਕੱਢਣਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ HTML canvas API ਦੀ ਵਰਤੋਂ ਨਾਲ ਹੁੰਦਾ ਹੈ। ਚਿੱਤਰ ਤੁਹਾਡੇ ਡਿਵਾਈਸ ਉੱਤੇ ਹੀ ਰਹਿੰਦਾ ਹੈ, ਜਿਸ ਨਾਲ ਇਹ ਟੂਲ ਅਣ-ਜਾਰੀ ਪ੍ਰੋਡਕਟ ਫ਼ੋਟੋਆਂ, ਡਰਾਫਟ ਮੌਕਅੱਪ ਅਤੇ NDA ਅਧੀਨ ਬ੍ਰਾਂਡ ਐਸੈੱਟਾਂ ਲਈ ਸੁਰੱਖਿਅਤ ਬਣ ਜਾਂਦਾ ਹੈ।
privacyਬ੍ਰਾਂਡ ਪਛਾਣ ਦੇ ਕੰਮ ਲਈ, 5-8 ਰੰਗ ਸਭ ਤੋਂ ਵਧੀਆ ਚੋਣ ਹਨ — ਇਹ ਐਕਸੈਂਟ ਚੋਣਾਂ ਨੂੰ ਪਤਲਾ ਕੀਤੇ ਬਿਨਾਂ ਮੁੱਖ ਥੀਮ ਨੂੰ ਫੜ ਲੈਂਦਾ ਹੈ। ਡਾਟਾ ਵਿਜ਼ੁਅਲਾਈਜ਼ੇਸ਼ਨ ਲਈ ਅਸੀਂ 10-16 ਰੰਗਾਂ ਦੀ ਸਿਫ਼ਾਰਸ਼ ਕਰਦੇ ਹਾਂ ਤਾਂ ਜੋ ਤੁਹਾਡੇ ਕੋਲ ਕਾਫ਼ੀ ਵੱਖ-ਵੱਖ ਰੰਗ ਹੋਣ। ਸਲਾਈਡਰ ਤੁਹਾਨੂੰ 5 ਤੇ 24 ਵਿਚਕਾਰ ਚੋਣ ਕਰਨ ਦਿੰਦਾ ਹੈ।
tips128 ਤੋਂ ਘੱਟ ਐਲਫਾ ਵਾਲੇ ਪਿਕਸਲ ਨਜ਼ਰਅੰਦਾਜ਼ ਕੀਤੇ ਜਾਂਦੇ ਹਨ, ਇਸ ਲਈ ਪਾਰਦਰਸ਼ੀ ਪਿਛੋਕੜ ਰੰਗ-ਪਟ ਨੂੰ "ਪਿਛੋਕੜ" ਰੰਗਾਂ ਨਾਲ ਖ਼ਰਾਬ ਨਹੀਂ ਕਰਦੇ। ਇਹ Image Color Picker ਨੂੰ ਉਤਪਾਦ ਕੱਟਆਊਟ, ਸਟਿੱਕਰ ਕਲਾਕਾਰੀ ਅਤੇ ਵੱਖ ਕੀਤੇ ਵਿਸ਼ਿਆਂ ਲਈ ਖ਼ਾਸ ਤੌਰ 'ਤੇ ਵਧੀਆ ਬਣਾਉਂਦਾ ਹੈ।
technicalHEX (#RRGGBB) ਸਭ ਤੋਂ ਸੰਖੇਪ ਹੈ ਅਤੇ ਇਹੀ CSS, Figma ਅਤੇ Sketch ਮੂਲ ਰੂਪ ਵਿੱਚ ਵਰਤਦੇ ਹਨ। RGB 0-255 ਤੱਕ ਤਿੰਨ ਘਟਕ ਮੁੱਲ ਦਿਖਾਉਂਦਾ ਹੈ — ਜਦੋਂ ਚਿੱਤਰ ਡਾਟੇ ਨਾਲ ਪ੍ਰੋਗਰਾਮ ਰਾਹੀਂ ਕੰਮ ਕਰਨਾ ਹੋਵੇ ਤਾਂ ਲਾਭਦਾਇਕ। HSL (hue, saturation, lightness) ਰੰਗਾਂ ਨੂੰ ਅਨੁਕੂਲ ਕਰਨ ਲਈ ਸਹਿਜ ਹੈ: ਰੰਗ ਪਰਿਵਾਰ ਬਦਲਣ ਲਈ hue ਬਦਲੋ, ਅਤੇ tint ਤੇ shade ਲਈ lightness ਅਨੁਕੂਲ ਕਰੋ।
technicalYes. Free, free account required to download, no limits on image size or number of palettes extracted. There is nothing to install — the entire tool is a single web page.
pricingNo image needed. The Color Picker & Wheel at the top works on its own — drag the saturation/brightness square and the hue slider, or type any HEX, RGB or HSL value to dial in an exact color. Uploading an image is optional, just for eyedropping colors out of a photo.
usagePick your base color and the Color harmonies panel instantly builds complementary, analogous, triadic, split-complementary, tetradic and monochromatic schemes using color-wheel theory. Click any swatch to copy its HEX code.
featuresਸਟੈਂਡਅਲੋਨ Color Picker & Wheel ਵਿੱਚ, ਆਪਣਾ ਰੰਗ ਸੈੱਟ ਕਰੋ ਅਤੇ ਪੈਨਲ ਇਸਦਾ ਸ਼ੁੱਧ ਚਿੱਟੇ ਅਤੇ ਸ਼ੁੱਧ ਕਾਲੇ ਵਿਰੁੱਧ ਕੰਟਰਾਸਟ ਅਨੁਪਾਤ WCAG ਰੇਟਿੰਗ ਦੇ ਨਾਲ ਦਿਖਾਉਂਦਾ ਹੈ — AAA, AA, AA Large, ਜਾਂ Fail। ਕਿਸੇ ਟੈਕਸਟ ਜਾਂ ਬਟਨ ਦਾ ਰੰਗ ਅੰਤਿਮ ਰੂਪ ਦੇਣ ਤੋਂ ਪਹਿਲਾਂ ਇਸਨੂੰ ਵਰਤੋ ਤਾਂ ਜੋ ਇਹ ਪੜ੍ਹਨਯੋਗ ਰਹੇ ਅਤੇ WCAG 2.1 ਪਹੁੰਚਯੋਗਤਾ ਦਿਸ਼ਾ-ਨਿਰਦੇਸ਼ਾਂ ਨੂੰ ਪੂਰਾ ਕਰੇ।
featuresਹਾਂ। ਸੁਤੰਤਰ Color Picker & Wheel ਤੁਹਾਡੇ ਵੱਲੋਂ ਸੈੱਟ ਕੀਤੇ ਕਿਸੇ ਵੀ HEX, RGB ਜਾਂ HSL ਮੁੱਲ ਦੇ ਕੋਲ ਸਭ ਤੋਂ ਨੇੜਲਾ ਮੇਲ ਖਾਂਦਾ ਨਾਮੀ CSS ਰੰਗ ਦਿਖਾਉਂਦਾ ਹੈ, ਜੋ ਬਿਨਾਂ ਅੰਦਾਜ਼ਾ ਲਾਏ ਕਿਸੇ ਬ੍ਰੀਫ, ਟਿਕਟ ਜਾਂ ਡਿਜ਼ਾਈਨ ਸਪੈੱਕ ਵਿੱਚ ਇੱਕ ਸ਼ੇਡ ਨੂੰ ਝਟਪਟ ਦੱਸਣ ਲਈ ਸੌਖਾ ਹੈ।
featuresColor Picker & Wheel ਵਿੱਚ Random 'ਤੇ ਕਲਿੱਕ ਕਰਕੇ ਨਵੇਂ ਰੰਗ 'ਤੇ ਜਾਓ, ਫਿਰ ਇਸਦੇ ਹੇਠਾਂ Color harmonies ਪੈਨਲ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਉਸ ਰੰਗ ਤੋਂ ਬਣੇ ਪੂਰਕ, ਸਮਰੂਪ, ਤਿਕੋਣੀ ਅਤੇ ਹੋਰ ਤਾਲਮੇਲ ਵਾਲੇ ਪੈਲੇਟ ਵੇਖੋ — ਜਦੋਂ ਤੁਸੀਂ ਕਿਸੇ ਮੌਜੂਦਾ ਤਸਵੀਰ ਤੋਂ ਨਮੂਨਾ ਲੈਣ ਦੀ ਬਜਾਏ ਬਿਲਕੁਲ ਸ਼ੁਰੂ ਤੋਂ ਡਿਜ਼ਾਈਨ ਕਰ ਰਹੇ ਹੋ ਤਾਂ ਸ਼ੁਰੂਆਤੀ ਬਿੰਦੂ ਲੱਭਣ ਦਾ ਇੱਕ ਤੇਜ਼ ਤਰੀਕਾ।
tips5, 8, 10, 16 ਜਾਂ 24 ਪ੍ਰਮੁੱਖ ਰੰਗ ਚੁਣਨ ਲਈ ਪੈਲੇਟ ਦੇ ਉੱਪਰ Size ਡ੍ਰੌਪਡਾਊਨ ਵਰਤੋ — ਜਿਵੇਂ ਤੁਸੀਂ ਇਸਨੂੰ ਬਦਲਦੇ ਹੋ ਪੈਲੇਟ ਤੁਰੰਤ ਦੁਬਾਰਾ ਗਿਣਿਆ ਜਾਂਦਾ ਹੈ। ਸਾਫ਼ ਬ੍ਰਾਂਡ ਪੈਲੇਟ ਲਈ 5 ਵਰਗੇ ਛੋਟੇ ਆਕਾਰ ਨੂੰ picked-color eyedropper ਨਾਲ ਜੋੜੋ ਤਾਂ ਜੋ ਇੱਕ ਜਾਂ ਦੋ ਸਟੀਕ ਐਕਸੈਂਟ ਸ਼ੇਡ ਫੜ ਸਕੋ ਜਿਨ੍ਹਾਂ ਨੂੰ ਆਟੋਮੈਟਿਕ ਐਕਸਟ੍ਰੈਕਸ਼ਨ ਔਸਤ ਕਰਕੇ ਗੁਆ ਸਕਦਾ ਹੈ।
tipsਹਾਂ — ਸੁਤੰਤਰ Color Picker & Wheel ਤੁਹਾਡੇ ਮੌਜੂਦਾ ਰੰਗ ਦਾ ਸ਼ੁੱਧ ਚਿੱਟੇ ਅਤੇ ਸ਼ੁੱਧ ਕਾਲੇ ਨਾਲ ਕੰਟ੍ਰਾਸਟ ਅਨੁਪਾਤ ਸਵੈਚ ਦੇ ਬਿਲਕੁਲ ਹੇਠਾਂ ਦਿਖਾਉਂਦਾ ਹੈ, ਜੋ WCAG ਹੱਦਾਂ (7:1, 4.5:1, 3:1) ਅਨੁਸਾਰ AAA, AA, AA Large ਜਾਂ Fail ਵਜੋਂ ਲੇਬਲ ਕੀਤਾ ਹੁੰਦਾ ਹੈ। ਡਿਜ਼ਾਈਨ ਰੰਗ ਪੱਕਾ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ ਇਹ ਜਾਂਚਣ ਲਈ ਇਸਨੂੰ ਵਰਤੋ ਕਿ ਟੈਕਸਟ/ਬੈਕਗਰਾਊਂਡ ਜੋੜੀ ਪਹੁੰਚਯੋਗਤਾ ਮਿਆਰ ਪੂਰੇ ਕਰਦੀ ਹੈ।
featuresColor Picker & Wheel ਆਪਣੇ-ਆਪ ਹੀ ਤੁਹਾਡੇ ਵੱਲੋਂ ਸੈੱਟ ਕੀਤੇ ਕਿਸੇ ਵੀ ਰੰਗ ਨੂੰ — ਪਿਕਰ, HEX ਬਾਕਸ, ਜਾਂ RGB/HSL ਫੀਲਡਾਂ ਰਾਹੀਂ — ਇਸਦੇ ਸਭ ਤੋਂ ਨੇੜਲੇ ਮਿਆਰੀ CSS ਰੰਗ ਦੇ ਨਾਮ ਨਾਲ ਮਿਲਾਉਂਦਾ ਹੈ, ਜੋ ਸਵੈਚ ਦੇ ਕੋਲ 'Closest name' ਵਜੋਂ ਦਿਖਾਇਆ ਜਾਂਦਾ ਹੈ। ਇਹ ਕਿਸੇ ਰੰਗ ਨੂੰ ਜ਼ੁਬਾਨੀ ਬਿਆਨ ਕਰਨ ਜਾਂ ਇਸਦਾ ਸਭ ਤੋਂ ਨੇੜਲਾ ਵੈੱਬ-ਸੇਫ ਬਰਾਬਰ ਲੱਭਣ ਦਾ ਇੱਕ ਤੇਜ਼ ਤਰੀਕਾ ਹੈ।
featuresਹਾਂ — ਅੱਪਲੋਡ ਕੀਤੇ ਚਿੱਤਰ 'ਤੇ ਹਰ ਕਲਿੱਕ ਜਾਂ ਟੈਪ ਆਖ਼ਰੀ ਸਵੈਚ ਨੂੰ ਬਦਲਣ ਦੀ ਥਾਂ ਤੁਹਾਡੀ Picked Colors ਸੂਚੀ ਵਿੱਚ ਨਵਾਂ ਸਵੈਚ ਜੋੜਦਾ ਹੈ, ਇਸ ਲਈ ਤੁਸੀਂ ਫੋਟੋ ਦੇ ਵੱਖ-ਵੱਖ ਹਿੱਸਿਆਂ ਤੋਂ ਸਹੀ ਪਿਕਸਲ ਰੰਗਾਂ ਦਾ ਇੱਕ ਕਸਟਮ ਸੈੱਟ ਬਣਾ ਸਕਦੇ ਹੋ। ਕਿਸੇ ਵੀ ਇੱਕ ਸਵੈਚ ਨੂੰ ਇਸ ਦੇ × ਬਟਨ ਨਾਲ ਹਟਾਓ, ਜਾਂ ਪੂਰੀ ਸੂਚੀ ਨੂੰ Clear picked ਨਾਲ ਸਾਫ਼ ਕਰੋ।
usageਹਾਂ — Color Picker & Wheel ਵਿੱਚ Random ਬਟਨ (ਸ਼ਫਲ ਆਈਕਨ) ਇੱਕ ਕਲਿੱਕ ਵਿੱਚ ਨਵੀਂ hue, saturation ਅਤੇ brightness ਸੰਯੋਜਨ 'ਤੇ ਪਹੁੰਚ ਜਾਂਦਾ ਹੈ, ਜੋ ਰਚਨਾਤਮਕ ਰੁਕਾਵਟ ਤੋੜਨ ਜਾਂ ਅਜਿਹਾ ਪੈਲੇਟ ਖੋਜਣ ਲਈ ਲਾਭਦਾਇਕ ਹੈ ਜੋ ਤੁਸੀਂ ਹੱਥੀਂ ਟਾਈਪ ਨਾ ਕਰਦੇ। HEX, RGB, HSL ਅਤੇ ਹੇਠਾਂ ਵਾਲੇ harmony ਸਵੈਚ ਸਭ ਇਕੱਠੇ ਅੱਪਡੇਟ ਹੁੰਦੇ ਹਨ।
featuresਟੱਚਸਕ੍ਰੀਨ 'ਤੇ, ਚਿੱਤਰ ਦੇ ਪਾਰ ਆਪਣੀ ਉਂਗਲ ਖਿੱਚੋ ਤਾਂ ਜੋ ਇਸ ਦੇ ਹੇਠਲੇ ਰੰਗ ਨੂੰ ਇੱਕ ਲਾਈਵ ਫ਼ਲੋਟਿੰਗ ਸਵੈਚ ਵਿੱਚ ਪ੍ਰੀਵਿਊ ਕਰ ਸਕੋ, ਫਿਰ ਉਸ ਬਿਲਕੁਲ ਪਿਕਸਲ ਨੂੰ ਆਪਣੀ Picked Colors ਸੂਚੀ ਵਿੱਚ ਜੋੜਨ ਲਈ ਆਪਣੀ ਉਂਗਲ ਚੁੱਕੋ — ਕਿਸੇ ਵੱਖਰੇ ਪੁਸ਼ਟੀ ਟੈਪ ਦੀ ਲੋੜ ਨਹੀਂ। ਓਹੀ palette-size ਡ੍ਰੌਪਡਾਊਨ ਅਤੇ ਐਕਸਪੋਰਟ ਬਟਨ ਮੋਬਾਈਲ 'ਤੇ ਇੱਕੋ ਜਿਹੇ ਕੰਮ ਕਰਦੇ ਹਨ।
usageਹਾਂ। ਪੰਨੇ ਦੇ ਸਿਖਰ 'ਤੇ ਮੌਜੂਦ ਕਲਰ ਵ੍ਹੀਲ ਵਿੱਚ ਇੱਕ Random ਬਟਨ ਹੈ ਜੋ ਕਿਸੇ ਬੇਤਰਤੀਬ ਰੰਗ 'ਤੇ ਜਾਂਦਾ ਹੈ ਅਤੇ ਤੁਰੰਤ ਇਸਦੇ HEX, RGB ਅਤੇ HSL ਕੋਡ, ਇਸਦਾ ਸਭ ਤੋਂ ਨੇੜਲਾ ਨਾਮੀ ਰੰਗ, ਚਿੱਟੇ ਅਤੇ ਕਾਲੇ 'ਤੇ ਕੰਟ੍ਰਾਸਟ ਰੇਸ਼ੋ, ਅਤੇ ਪੂਰੇ ਹਾਰਮਨੀ ਸੈੱਟ — ਕੰਪਲੀਮੈਂਟਰੀ, ਐਨਾਲੌਗਸ, ਟ੍ਰਾਈਐਡਿਕ, ਸਪਲਿਟ ਕੰਪਲੀਮੈਂਟਰੀ, ਟੈਟ੍ਰਾਡਿਕ ਅਤੇ ਮੋਨੋਕ੍ਰੋਮੈਟਿਕ — ਦਿਖਾਉਂਦਾ ਹੈ। ਇਹ ਪੈਲੇਟ ਲਈ ਸ਼ੁਰੂਆਤੀ ਬਿੰਦੂ ਖੋਜਣ ਦਾ ਇੱਕ ਤੇਜ਼ ਤਰੀਕਾ ਹੈ।
featuresਇਹ ਟੂਲ ਤੁਹਾਡੀ ਲਾਈਵ ਸਕਰੀਨ ਪੜ੍ਹਨ ਦੀ ਬਜਾਏ ਅੱਪਲੋਡ ਕੀਤੀ ਇਮੇਜ ਜਾਂ ਬਿਲਟ-ਇਨ ਕਲਰ ਵ੍ਹੀਲ ਤੋਂ ਰੰਗ ਨਮੂਨੇ ਲੈਂਦਾ ਹੈ। ਸਕਰੀਨ ਕਲਰ ਪਿਕਰ ਲਈ ਸਭ ਤੋਂ ਤੇਜ਼ ਤਰੀਕਾ: ਇੱਕ ਸਕਰੀਨਸ਼ਾਟ ਲਓ, ਇਸਨੂੰ ਪੇਜ 'ਤੇ ਸੁੱਟੋ, ਅਤੇ ਲੋੜੀਂਦੇ ਸਹੀ ਪਿਕਸਲ 'ਤੇ ਕਲਿੱਕ ਕਰੋ — ਤੁਹਾਨੂੰ ਬਿਨਾਂ ਕੋਈ ਐਕਸਟੈਂਸ਼ਨ ਇੰਸਟਾਲ ਕੀਤੇ ਉਹੀ HEX, RGB ਅਤੇ HSL ਕੋਡ ਮਿਲ ਜਾਂਦੇ ਹਨ, ਅਤੇ ਸਕਰੀਨਸ਼ਾਟ ਕਦੇ ਵੀ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਤੋਂ ਬਾਹਰ ਨਹੀਂ ਜਾਂਦਾ।
tipsਕਲਰ ਪਿਕਰ ਤੁਹਾਡਾ ਕੰਮ ਕਰਨ ਵਿੱਚ ਕਿਵੇਂ ਮਦਦ ਕਰਦਾ ਹੈ
ਅਸਲ ਸਮੱਸਿਆਵਾਂ ਜੋ ਇਹ ਹਰ ਰੋਜ਼ ਹੱਲ ਕਰਦਾ ਹੈ — ਕਾਰੋਬਾਰਾਂ, ਰਚਨਾਕਾਰਾਂ, ਅਤੇ ਰੋਜ਼ਾਨਾ ਕੰਮਾਂ ਲਈ। ਆਪਣੇ ਲਈ ਢੁਕਵਾਂ ਵਰਤੋਂ ਮਾਮਲਾ ਲੱਭੋ ਅਤੇ ਸਕਿੰਟਾਂ ਵਿੱਚ ਸ਼ੁਰੂ ਕਰੋ।
ਬ੍ਰਾਂਡ ਪਛਾਣ ਆਡਿਟ
ਆਪਣੀ ਸਟਾਈਲ ਗਾਈਡ ਵਿੱਚ ਪਾਉਣ ਲਈ ਮੌਜੂਦਾ ਲੋਗੋ ਜਾਂ ਮਾਰਕੀਟਿੰਗ ਐਸੈੱਟ ਵਿੱਚੋਂ ਠੀਕ HEX ਮੁੱਲ ਕੱਢੋ। ਪੋਜ਼ੀਸ਼ਨਿੰਗ ਡੈੱਕ ਜਾਂ ਪਿਚ ਲਈ ਮੁਕਾਬਲੇਬਾਜ਼ ਬ੍ਰਾਂਡ ਰੰਗਾਂ ਨਾਲ ਮਿਲਾਓ।
ਵੈੱਬ ਡਿਜ਼ਾਈਨ ਪੈਲੇਟ ਬਣਾਉਣਾ
ਕਿਸੇ ਫ਼ੋਟੋ ਜਾਂ ਮੂਡ-ਬੋਰਡ ਵਿੱਚੋਂ ਪ੍ਰਮੁੱਖ ਰੰਗ ਕੱਢੋ, ਉਹਨਾਂ ਨੂੰ CSS ਵੈਰੀਏਬਲਾਂ ਵਜੋਂ ਐਕਸਪੋਰਟ ਕਰੋ, ਅਤੇ ਆਪਣੀ ਸਟਾਈਲਸ਼ੀਟ ਵਿੱਚ ਪਾ ਦਿਓ। 5-8 ਰੰਗਾਂ ਦੀ ਸਹੀ ਰੇਂਜ ਪੂਰੇ ਡਿਜ਼ਾਈਨ ਸਿਸਟਮ ਦੇ ਅਧਾਰ ਲਈ ਪ੍ਰਾਇਮਰੀ, ਐਕਸੈਂਟ ਅਤੇ ਨਿਊਟ੍ਰਲ ਰੰਗ ਕਵਰ ਕਰਦੀ ਹੈ।
ਈ-ਕਾਮਰਸ ਉਤਪਾਦ ਸੂਚੀਆਂ
ਪ੍ਰੋਡਕਟ ਫ਼ੋਟੋ ਦੇ ਬੈਕਗ੍ਰਾਊਂਡ ਰੰਗਾਂ ਨੂੰ ਆਪਣੇ ਸਟੋਰ ਦੀ ਥੀਮ ਨਾਲ ਮਿਲਾਓ। ਸਨੀਕਰ ਜਾਂ ਪਹਿਰਾਵੇ ਦੀ ਫ਼ੋਟੋ ਤੋਂ ਪ੍ਰਮੁੱਖ ਐਕਸੈਂਟ ਰੰਗ ਚੁਣੋ ਅਤੇ ਇਸ ਨੂੰ ਲਿਸਟਿੰਗ ਦੇ ਕਾਲ-ਆਊਟ ਹਾਈਲਾਈਟ ਵਜੋਂ ਵਰਤੋ।
ਅੰਦਰੂਨੀ ਸਜਾਵਟ ਤੇ ਫੈਸ਼ਨ ਪ੍ਰੇਰਨਾ
ਆਪਣੇ ਪਸੰਦ ਦੇ ਕਮਰੇ ਜਾਂ ਪਹਿਰਾਵੇ ਦੀ ਫੋਟੋ ਖਿੱਚੋ ਅਤੇ ਉਸ ਦਾ ਰੰਗ-ਪਟ ਕੱਢੋ। ਇਸ ਨੂੰ ਅਜਿਹਾ ਪੇਂਟ, ਕੱਪੜਾ ਜਾਂ ਸਜਾਵਟੀ ਸਮਾਨ ਚੁਣਨ ਲਈ ਵਰਤੋ ਜੋ ਮੌਜੂਦਾ ਤਰਤੀਬ ਨਾਲ ਮੇਲ ਖਾਂਦਾ ਹੋਵੇ — ਇਸ ਤਰ੍ਹਾਂ ਦ੍ਰਿਸ਼ ਪ੍ਰੇਰਣਾ ਨੂੰ ਕੰਮ-ਯੋਗ ਰੰਗ ਨਮੂਨਿਆਂ ਵਿੱਚ ਬਦਲਿਆ ਜਾਂਦਾ ਹੈ।
ਡੇਟਾ ਵਿਜ਼ੁਅਲਾਈਜ਼ੇਸ਼ਨ ਸਕੀਮਾਂ
ਉਸ ਚਿੱਤਰ ਤੋਂ ਲਏ 10-16 ਰੰਗਾਂ ਦਾ ਸ਼੍ਰੇਣੀਬੱਧ ਪੈਲੇਟ ਤਿਆਰ ਕਰੋ ਜਿਸ ਦਾ ਅਹਿਸਾਸ ਤੁਸੀਂ ਦੇਣਾ ਚਾਹੁੰਦੇ ਹੋ (ਜਿਵੇਂ ਕਿ ਨਰਮ ਚਾਰਟ ਲਈ ਵਾਟਰ ਕਲਰ ਪੇਂਟਿੰਗ, ਜਾਂ ਗਰਮ-ਤੋਂ-ਠੰਡੇ ਗ੍ਰੇਡੀਐਂਟ ਲਈ ਸੂਰਜ ਡੁੱਬਣ ਦਾ ਦ੍ਰਿਸ਼)। ਆਮ ਰੰਗ ਚੁਣਨ ਨਾਲੋਂ ਬਿਹਤਰ।
ਗੇਮ ਅਤੇ UI ਐਸਟ ਵਰਕਫਲੋ
ਪਿਕਸਲ-ਆਰਟ ਔਜ਼ਾਰ ਜਾਂ ਗੇਮ ਇੰਜਣ ਵਿੱਚ ਪਾਉਣ ਲਈ ਸਪ੍ਰਾਈਟ ਆਰਟ ਜਾਂ UI ਮੌਕਅੱਪਾਂ ਵਿੱਚੋਂ ਇੰਡੈਕਸ ਕੀਤਾ ਰੰਗ ਪੈਲੇਟ ਕੱਢੋ। ਪੈਲੇਟ JSON ਐਕਸਪੋਰਟ Aseprite, Photoshop ਅਤੇ ਜ਼ਿਆਦਾਤਰ ਐਸੈੱਟ ਪਾਈਪਲਾਈਨਾਂ ਨਾਲ ਜੁੜਦਾ ਹੈ।
ਸ਼ਿਪ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ WCAG ਕੰਟਰਾਸਟ ਜਾਂਚਾਂ
ਅਲੱਗ Color Picker & Wheel ਵਿੱਚ ਟੈਕਸਟ ਅਤੇ ਬੈਕਗ੍ਰਾਊਂਡ ਰੰਗ ਦੀ ਜੋੜੀ ਸੈੱਟ ਕਰੋ ਅਤੇ ਚਿੱਟੇ ਤੇ ਕਾਲੇ ਦੇ ਮੁਕਾਬਲੇ ਇਹਨਾਂ ਦਾ ਕੰਟਰਾਸਟ ਰੇਸ਼ੋ ਤੁਰੰਤ ਪੜ੍ਹੋ, ਤਾਂ ਜੋ ਤੁਸੀਂ AA/AAA ਪਹੁੰਚਯੋਗਤਾ ਦੀ ਕਮੀ ਨੂੰ ਪ੍ਰੋਡਕਸ਼ਨ ਤੱਕ ਪਹੁੰਚਣ ਤੋਂ ਪਹਿਲਾਂ ਫੜ ਸਕੋ।
ਕਸਟਮ ਪੇਂਟ ਅਤੇ ਪ੍ਰਿੰਟ ਰੰਗ ਸੈੱਟ ਕਰੋ
ਫੋਟੋ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਛੱਡ ਦਿਓ — ਕਿਸੇ ਖਾਸ ਪੇਂਟ ਮਿਸ਼ਰਣ, ਸਪਾਟ ਰੰਗ, ਜਾਂ ਬ੍ਰਾਂਡ ਟੋਨ ਨੂੰ ਸਹੀ ਢੰਗ ਨਾਲ ਤੈਅ ਕਰਨ ਲਈ ਇੱਕ ਸਟੀਕ HEX, RGB ਜਾਂ HSL ਮੁੱਲ ਟਾਈਪ ਕਰੋ, ਜਾਂ ਸੰਤ੍ਰਿਪਤਾ/ਰੰਗਤ ਕੰਟਰੋਲਾਂ ਨੂੰ ਖਿੱਚੋ, ਫਿਰ ਸਪਲਾਇਰ ਨਾਲ ਆਸਾਨ ਸੰਚਾਰ ਲਈ ਇਸਦੇ ਸਭ ਤੋਂ ਨੇੜਲੇ ਨਾਮਿਤ ਰੰਗ ਦੀ ਜਾਂਚ ਕਰੋ।
ਇੱਕ ਫ਼ੋਟੋ ਤੋਂ ਬਹੁ-ਬਿੰਦੂ ਸਵੈਚ ਬੋਰਡ
ਇੱਕ ਹੀ ਹਵਾਲਾ ਫੋਟੋ 'ਤੇ ਕਈ ਥਾਵਾਂ 'ਤੇ ਕਲਿੱਕ ਕਰੋ — ਅਸਮਾਨ, ਪੁਸ਼ਾਕ, ਫੁੱਲ — ਤਾਂ ਜੋ ਆਪਣੇ-ਆਪ ਕੱਢੇ ਗਏ ਪ੍ਰਮੁੱਖ ਪੈਲੇਟ 'ਤੇ ਭਰੋਸਾ ਕਰਨ ਦੀ ਬਜਾਏ ਇੱਕ ਚੋਣਵਾਂ ਬਹੁ-ਰੰਗੀ ਸਵੈਚ ਸੈੱਟ ਬਣਾਇਆ ਜਾ ਸਕੇ, ਫਿਰ ਇਸਨੂੰ ਕਲਾਇੰਟ ਮੂਡ ਬੋਰਡ ਲਈ JSON ਜਾਂ CSS ਵਜੋਂ ਐਕਸਪੋਰਟ ਕਰੋ।
ਤੁਰੰਤ ਬ੍ਰਾਂਡ ਰੰਗ ਹਾਰਮਨੀ ਸੈੱਟ
ਇੱਕ ਬ੍ਰਾਂਡ HEX ਕੋਡ ਦਰਜ ਕਰੋ ਅਤੇ Color harmonies ਪੈਨਲ ਕੁਝ ਸਕਿੰਟਾਂ ਵਿੱਚ ਵਰਤਣ-ਲਈ-ਤਿਆਰ ਪੂਰਕ, ਤ੍ਰੈ-ਰੰਗੀ ਅਤੇ ਸਪਲਿਟ-ਪੂਰਕ ਸਵਾਚ ਸੈੱਟ ਬਣਾਉਂਦਾ ਹੈ — ਕਿਸੇ ਡਿਜ਼ਾਈਨਰ ਨੂੰ ਭਾੜੇ ਲਏ ਬਿਨਾਂ ਸੋਸ਼ਲ ਮੀਡੀਆ ਟੈਂਪਲੇਟ ਜਾਂ ਵਿਗਿਆਪਨ ਵੇਰੀਐਂਟ ਪੈਲੇਟ ਲਈ ਸੰਪੂਰਨ।
ਮੁਕਾਬਲੇਬਾਜ਼ ਦੇ ਸਕ੍ਰੀਨਸ਼ਾਟ ਤੋਂ ਡਿਜ਼ਾਈਨ ਟੋਕਨ ਪੈਲੇਟ ਕੱਢੋ
ਕਿਸੇ ਫੋਟੋ ਦੀ ਬਜਾਏ ਕਿਸੇ ਪ੍ਰਤੀਯੋਗੀ ਦੀ ਵੈੱਬਸਾਈਟ ਜਾਂ ਐਪ ਦਾ ਸਕ੍ਰੀਨਸ਼ਾਟ ਅੱਪਲੋਡ ਕਰੋ, ਅਤੇ ਪ੍ਰਮੁੱਖ-ਪੈਲੇਟ ਐਕਸਟ੍ਰੈਕਟਰ ਇਸਦੇ ਸਟੀਕ ਬੈਕਗ੍ਰਾਊਂਡ, ਐਕਸੈਂਟ ਅਤੇ ਟੈਕਸਟ ਰੰਗਾਂ ਨੂੰ HEX ਕੋਡਾਂ ਵਜੋਂ ਕੱਢ ਲੈਂਦਾ ਹੈ ਜਿਨ੍ਹਾਂ ਨੂੰ ਤੁਸੀਂ CSS ਵੇਰੀਏਬਲਾਂ ਵਜੋਂ ਐਕਸਪੋਰਟ ਕਰ ਸਕਦੇ ਹੋ — ਕਿਸੇ ਕੰਪ ਜਾਂ ਪਿੱਚ ਡੈੱਕ ਲਈ ਰੰਗ ਸਕੀਮ ਨੂੰ ਰਿਵਰਸ-ਇੰਜੀਨੀਅਰ ਕਰਨ ਦਾ ਇੱਕ ਤੇਜ਼ ਤਰੀਕਾ।
