نحوه استفاده
- یک تصویر انتخاب کنید یا آن را روی کادر بکشید و رها کنید.
- نشانگر را روی تصویر حرکت دهید؛ ذره‌بین پیکسل‌های اطراف آن را نشان می‌دهد.
- برای انتخاب رنگ کلیک یا لمس کنید و آن را به‌صورت HEX، RGB یا HSL کپی کنید.
- برای دیدن رنگ‌های غالب به پایین بروید، تعداد موردنظر را انتخاب کنید و آن‌ها را کپی کنید یا به‌صورت متغیرهای CSS دانلود کنید.
نحوه کار
تصویر روی بومی در مرورگر شما رسم می‌شود و رنگ دقیق همان پیکسلی که نشانگر روی آن قرار دارد از روی آن خوانده می‌شود. ذره‌بین ناحیه‌ای 11 × 11 پیکسلی را بزرگ‌نمایی می‌کند و پیکسل انتخاب‌شده با یک قاب مشخص می‌شود. تصاویری که هر ضلع آن‌ها بزرگ‌تر از 4096 پیکسل باشد ابتدا کوچک می‌شوند؛ بنابراین در عکس‌های خیلی بزرگ، هر پیکسل انتخاب‌شده میانگین چند پیکسل اصلی است.
رنگ‌های غالب با خوشه‌بندی k-means پیدا می‌شوند: ابتدا پیکسل‌ها به 32,768 سطل رنگ کوچک گروه‌بندی می‌شوند، سپس سطل‌ها به تعداد رنگ انتخابی شما ادغام می‌شوند و وزن هر سطل بر اساس تعداد پیکسل‌های آن است. نقاط شروع به‌طور قطعی انتخاب می‌شوند؛ بنابراین تصویر یکسان همیشه پالت یکسانی می‌دهد.
رنگ‌ها در فضای sRGB که مرورگر برای نمایش استفاده می‌کند خوانده می‌شوند. اگر تصویری پروفایل رنگی با گستره وسیع داشته باشد، ممکن است مقدارها کمی با آنچه ویرایشگر عکس نشان می‌دهد متفاوت باشند. در مرورگرهایی که از آن پشتیبانی می‌کنند (Chrome و Edge روی دسکتاپ)، دکمه انتخاب از صفحه از EyeDropper داخلی برای برداشتن رنگ از هر جای صفحه استفاده می‌کند.
نمونه‌ها
تطبیق رنگ برند
اسکرین‌شات یک لوگو را بارگذاری کنید، روی رنگ اصلی آن کلیک کنید و #1a73e8 یا rgb(26, 115, 232) را در CSS خود کپی کنید.
پالت رنگ از عکس
تقسیم یک عکس ساحل به 6 رنگ، ته‌رنگ‌های شن، دریا و آسمان را می‌دهد؛ هر کدام با سهمی از تصویر که می‌پوشاند، از بزرگ‌ترین به کوچک‌ترین مرتب شده است.
بررسی درجه رنگ
با ذره‌بین بزرگ‌نمایی کنید تا پیکسل دقیق یک خط نازک را انتخاب کنید، نه لبه ضدپله‌ای (anti-aliased) کنار آن.
پرسش‌های متداول
چرا رنگ کمی با ویرایشگر عکس من تفاوت دارد؟
مرورگرها تصاویر را برای نمایش به sRGB تبدیل می‌کنند. عکس‌های دارای پروفایل رنگی با گستره وسیع (Display P3، Adobe RGB) ممکن است مقدارهای کمی متفاوت در ویرایشگری که پروفایل اصلی را نگه می‌دارد نشان دهند.
چرا دکمه انتخاب از صفحه نمایش وجود ندارد؟
این قابلیت به EyeDropper API نیاز دارد که فقط برخی مرورگرها از آن پشتیبانی می‌کنند؛ در حال حاضر Chrome و Edge روی دسکتاپ. انتخاب از تصویر بارگذاری‌شده همه‌جا کار می‌کند.
رنگ‌های غالب چگونه انتخاب می‌شوند؟
با خوشه‌بندی k-means همه پیکسل‌ها، وزندهی شده بر اساس میزان وقوع هر رنگ. جزئیات کوچک اما واضح ممکن است با رنگ نزدیک بزرگ‌تر ادغام شوند؛ برای جدا کردن آن‌ها تعداد رنگ‌ها را افزایش دهید.
آیا تصویر بارگذاری می‌شود؟
خیر. این تصویر توسط همین صفحه در مرورگر شما رمزگشایی و تحلیل می‌شود و هرگز از دستگاه شما خارج نمی‌شود.
حریم خصوصی
تصویر به‌طور کامل در مرورگر شما پردازش می‌شود. بارگذاری نمی‌شود و رنگ‌های انتخاب‌شده ارسال یا ذخیره نمی‌شوند.