How are dominant colors calculated?

The image is downsampled and analyzed in 3D color space. High-frequency colors with sufficient contrast from one another are selected to represent the visual aesthetic of the photo.

Can I use the exported CSS variables in my web projects?

Yes! The exported CSS snippet defines clean standard CSS variables that you can drop straight into your style sheets or Tailwind config.

صورة 100% من جانب العميل

Image Color Palette Extractor

قم باستخراج لوحات الألوان السائدة ورموز HEX وRGB وHSL الدقيقة من أي صورة بنقرة واحدة.

تحميل صفر

لا يترك المتصفح أبدًا

سرعة فورية

تسارعت WASM

Drag & Drop your files here

or click to browse from your device

Extract 8 dominant, harmonious color swatches from any photo or design

Inspect HEX, RGB, and HSL values with one-click clipboard copying

Perceptual color distance clustering prevents duplicate or muddy shades

Export ready-to-use CSS Variables (--color-1, --color-2) or JSON palette

100% Client-side execution — fast, private, and works without servers

سير العمل البسيط

كيفية استخدام هذه الأداة

احصل على النتائج في ثلاث خطوات سريعة دون أي منحنى تعليمي.

Upload Image

Select or drag any JPEG, PNG, or WebP graphic into the dropzone.

Extract Palette

Our browser algorithm extracts the dominant colors and calculates proportions.

Copy or Export

Click on any HEX code to copy, or export the palette as CSS / JSON.

هل تحتاج إلى مساعدة؟

الأسئلة المتداولة

كل ما تحتاج لمعرفته حول هذه الأداة.

اكتشف المزيد

الأدوات ذات الصلة

عرض الكل صورة

Color Palette Generator

قم بإنشاء لوحات ألوان جميلة وعشوائية على الفور.

مولدات على الجهاز

Color Converter

تحويل رموز الألوان بين تنسيقات HEX وRGB وHSL.

المطورشائع على الجهاز

Photo Filters & Effects

قم بتطبيق مرشحات التدرج الرمادي والبني الداكن والعكس والعتيقة والسطوع والتباين على الصور.

صورةجديد على الجهاز

Loading...

Preparing your tools and workspace. Please wait a moment.