Herhangi Bir Pikselden Renk Bulmak İçin Renk Seçici Kullanma
Quick Answer
Renk seçmek için: Color Picker açın, resim yükleyin (veya screen eyedropper kullanın), rengini istediğiniz piksele tıklayın ve HEX, RGB ve HSL değerleri görünür. Tüm işleme yerel olarak olur.
Introduction
Color picker (eyedropper da denir), bir pikselin tam rengini bulmanızı sağlar. Bu, marka renklerini match etmek, resimlerden renk sample etmek veya foto'dan renk paleti oluşturmak için esastır. Browser tabanlı color picker'lar Canvas API ile yüklenen resimlerden renk okuyabilir ve EyeDropper API ekrandaki herhangi bir yerden renk seçebilir.
Step by Step
-
Open the Color Picker tool
Go to the Color Picker tool page. The tool supports picking colors from uploaded images and, in supported browsers, from anywhere on screen via the EyeDropper API.
-
Choose your source
To pick from an image: upload or drag-and-drop an image. To pick from the screen (Chrome/Edge only): click the 'Pick from screen' button, then click anywhere on your screen.
-
Click the pixel to sample
For image picking, move your cursor over the image and click the pixel whose color you want. The tool reads the pixel color from the canvas using getImageData(). A magnifier may help you select the exact pixel.
-
Read the color values
The tool displays the picked color in HEX, RGB, and HSL formats, along with a swatch. The values update instantly as you move the cursor.
-
Copy the color
Click Copy next to any format to copy the color value to your clipboard. Use it in your CSS, design tool, or application.
Examples
Pick a brand color from a logo
Input: logo.png, click on the brand color pixel
Output: HEX: #1a73e8, RGB: rgb(26, 115, 232), HSL: hsl(217, 89%, 51%)
Sample a color from a photo
Input: photo.jpg, click on a sky pixel
Output: HEX: #87ceeb, RGB: rgb(135, 206, 235), HSL: hsl(197, 71%, 73%)
Pick from screen (Chrome/Edge)
Input: Click 'Pick from screen', then click any pixel on your display
Output: HEX value of that pixel, e.g., #ff5733
Common Problems
- Anti-aliasing blends colors at edges —pixels on the edge between two colors are a blend. Sample from the center of a solid color area for accuracy.
- EyeDropper API not supported —the screen picker requires Chrome 95+ or Edge 95+. Firefox and Safari do not support it; use the image upload method instead.
- JPEG compression alters colors —JPEG lossy compression changes pixel colors slightly. For exact brand colors, use a PNG or the original vector source.
- Color profile differences —images with embedded color profiles (ICC) may display differently than their raw pixel values suggest.
Tips
- Use the magnifier to select the exact pixel —at high zoom, you can pick a single precise pixel rather than a blended edge.
- Sample multiple pixels from a solid area and average them if compression has introduced noise —this gives a more representative color.
- Use the EyeDropper API (Chrome/Edge) to pick colors from any application, not just images in the browser.
- Use our Color Picker for instant, private color sampling —your images never leave your browser.