انتخاب و تبدیل رنگ

یک ابزار کامل رنگ در چند بخش: انتخاب رنگ و گرفتن کد HEX/RGB/HSL/RGBA، تبدیل بین فرمت‌های رنگ (HEX، RGB، HSL، HSV، CMYK و نام CSS)، و برداشتن رنگ از روی هر پیکسل یک تصویر.

HEX#6366F1
RGBrgb(99, 102, 241)
HSLhsl(239, 84%, 67%)
RGBArgba(99, 102, 241, 1)

ابزار انتخاب و تبدیل رنگ یک مجموعه‌ی کامل است: رنگ دلخواه را انتخاب و کد آن را در فرمت‌های مختلف بگیرید، بین فرمت‌های رنگ تبدیل کنید، و رنگ را از روی هر پیکسل یک تصویر بردارید. برای طراحی و کدنویسی همیشه لازم است.

در بخش انتخاب رنگ، رنگ موردنظر را از پالت انتخاب کنید تا بلافاصله کد HEX، RGB، HSL و RGBA آن نمایش و با یک کلیک کپی شود.

در بخش «تبدیل فرمت رنگ» می‌توانید یک رنگ را در هر فرمتی (HEX، RGB، HSL، HSV، CMYK یا نام رنگ CSS) وارد کنید و هم‌زمان معادل آن در همه‌ی فرمت‌های دیگر را بگیرید؛ این برای کار بین طراحی چاپی (CMYK) و وب (HEX/RGB) لازم است. در بخش «برداشتن رنگ از تصویر» هم با آپلود یک عکس و کلیک روی هر نقطه، کد رنگ همان پیکسل و رنگ‌های غالب تصویر را می‌بینید.

طراحان و توسعه‌دهندگان روزانه از این ابزار استفاده می‌کنند. برای ساخت ست رنگی هماهنگ از ساخت پالت رنگی کمک بگیرید.

سوالات متداول

کد HEX رنگ چیست؟

HEX کدی شش‌رقمی مثل ff5733 است که رنگ را با ترکیب قرمز، سبز و آبی به‌صورت شانزده‌شانزدهی نشان می‌دهد.

تفاوت RGB و CMYK چیست؟

RGB برای نمایشگرها (نور) و CMYK برای چاپ (جوهر) است؛ در بخش تبدیل فرمت رنگ می‌توانید بین این‌ها تبدیل کنید.

چطور رنگ یک عکس یا لوگو را پیدا کنم؟

در بخش برداشتن رنگ از تصویر، عکس را آپلود کنید و روی نقطه‌ی موردنظر کلیک کنید تا کد دقیق رنگ همان پیکسل به شما داده شود.

کدام فرمت را در CSS استفاده کنم؟

هر سه فرمت HEX، RGB و HSL در CSS کار می‌کنند؛ HSL برای تنظیم روشنایی و اشباع رنگ راحت‌تر است.

ابزارهای مرتبط

ساخت گرادیان CSSگرادیان خطی یا شعاعی با چند رنگ بسازید و کد CSS آن را کپی کنید.
ساخت سایه CSSبا اسلایدر آفست، بلور، گسترش و رنگ، سایه‌ی دلخواه بسازید و کد CSS آن را کپی کنید.
ساخت افکت شیشه‌ای CSSافکت Glassmorphism (شیشه‌ای مات) با کنترل بلور، شفافیت و حاشیه بسازید.
ساخت پالت رنگیاز یک رنگ پایه، پالت‌های مکمل، مشابه، سه‌تایی، چهارتایی و تک‌رنگ بسازید و به‌صورت CSS خروجی بگیرید.
بررسی کنتراست رنگنسبت کنتراست دو رنگ را بر اساس استاندارد WCAG بسنجید و نتیجه‌ی AA/AAA را ببینید.
محاسبه نسبت ابعادبا وارد کردن عرض یا ارتفاع و انتخاب نسبت، بُعد دیگر را محاسبه کنید — مناسب تصاویر سوشال مدیا.