تبدیل RGB به HEX
مقدار قرمز، سبز و آبی یا یک رشته rgb() در CSS را وارد کنید و کد رنگ HEX معادل آن را بگیرید.
تبدیل رنگ‌های RGB به کد HEX
انتخابگرهای رنگ، ویرایشگرهای تصویر و کدهای گرافیکی اغلب رنگ را با سه عدد گزارش می‌کنند، اما CSS، توکن‌های طراحی و راهنماهای برند کد فشرده HEX را ترجیح می‌دهند. تبدیل RGB به HEX دقیق است: همان سه بایت فقط در مبنای ۱۶ نوشته می‌شوند.
این صفحه مبدل رنگ را با ورودی RGB و یک نمونه پرشده باز می‌کند.
تبدیل قدم‌به‌قدم
- مقدار هر کانال را، که عددی بین ۰ و ۲۵۵ است، در نظر بگیرید.
- آن را بر ۱۶ تقسیم کنید: خارج‌قسمت رقم اول هگز است و باقی‌مانده رقم دوم (۱۰ تا ۱۵ با A تا F نوشته می‌شوند).
- رقم‌های تکی را با یک صفر در ابتدا کامل کنید، تا ۱۰ بشود
0Aو نهA. - سه جفت را پشت سر یک
#بنویسید.
| RGB | هر کانال | HEX |
|---|---|---|
rgb(10, 132, 255) | 0A · 84 · FF | #0A84FF |
rgb(255, 87, 51) | FF · 57 · 33 | #FF5733 |
rgb(128, 128, 128) | 80 · 80 · 80 | #808080 |
فراموش کردن صفر ابتدایی باگ کلاسیک مبدل‌های دست‌ساز است: اگر ۱۰، ۱۳۲ و ۲۵۵ بدون صفر پشت هم نوشته شوند، #A84FF به دست می‌آید که رنگ معتبری نیست.
rgba() و HEX هشت‌رقمی
CSS سال‌هاست کدهای HEX هشت‌رقمی را می‌پذیرد. جفت چهارم آلفا است: آلفای بین ۰ و ۱ را در ۲۵۵ ضرب و گرد کنید؛ پس ۰٫۵ میشود ۱۲۸، یا در مبنای هگز 80. مبدل هم کد هشت‌رقمی و هم شکل rgba() را نشان می‌دهد تا هرکدام را که ابزارتان پشتیبانی می‌کند به کار ببرید.
تبدیل RGB به HEX در کد
در جاوااسکریپت: '#' + [r, g, b].map(v => v.toString(16).padStart(2, '0')).join(''). در پایتون: '#{:02X}{:02X}{:02X}'.format(r, g, b). هر دو روش صفر ابتدایی را خودشان اضافه می‌کنند.
ابزارهای مرتبط
برای مسیر برعکس از تبدیل HEX به RGB استفاده کنید؛ وقتی می‌خواهید روشنایی را به‌طور نظام‌مند تنظیم کنید از تبدیل HEX به HSL؛ و پیش از آنکه رنگی را برای متن به کار ببرید، از بررسی کنتراست رنگ.