چگونه یک رنگ را تشخیص می دهید؟ دریابید که چگونه یک رشته کوتاه از شش کاراکتر می تواند تمام آنچه را که باید بدانید به شما بگوید.
کار با رنگ ها در HTML نسبتاً ساده است. با چند اعلان ساده CSS، می توانید رنگ هر متن یا پس زمینه صفحه وب خود را تغییر دهید. اما چگونه یک رنگ را مشخص می کنید؟ پاسخ به این سوال ما را از سوراخ خرگوشی پایین میبرد که در نهایت ما را به مفهوم کدهای رنگ هگزا دسیمال هدایت میکند.
اگر قبلاً با HTML یا CSS کار کرده اید، احتمالاً اصطلاح کد هگز را شنیده اید. اما کد هگز دقیقا چیست؟ چند نمونه از کدهای هگز چیست؟ تفاوت بین کد هگز و کد رنگ RGB چیست؟
کد هگز چیست؟
هنگامی که برای اولین بار کار با رنگ را شروع می کنید، ممکن است از یک رابط گرافیکی برای انتخاب رنگ ها برای اعمال بر روی عناصر صفحه خود استفاده کنید. هنگامی که به جای صرفاً ویرایشگر گرافیکی خود، شروع به نگاه کردن به کد اصلی می کنید، متوجه می شوید که رنگ ها به صورت دنباله ای از کاراکترهای عجیب و غریب ظاهر می شوند. چنین توالی هایی به عنوان کدهای هگز شناخته می شوند. آنها چیزی شبیه به این هستند:
#FF0092
مطالب مرتبط: اصطلاحات ضروری طراحی گرافیک که باید بدانید
شما می توانید رنگ ها را در CSS به چند روش مختلف مشخص کنید. می توانید از نام برخی از رنگ های از پیش تعریف شده مانند قرمز و تیره سرخابی استفاده کنید. برای مشخص کردن سایه های دقیق رنگ، باید از اندازه گیری دقیق تری استفاده کنید: چیزی عددی.
CSS دو گزینه اصلی را ارائه می دهد: RGB و hex. در هر دو فرمت، مقادیر قرمز، سبز و آبی را که رنگ نهایی را تشکیل می دهند، مشخص می کنید. RGB از سه عدد بین 0 تا 255 استفاده می کند. Hex دقیقاً همین کار را می کند، فقط با پایه متفاوت (16) نسبت به اعشار (10) که به آن عادت کرده اید.
Hex از حروف A-F، علاوه بر ارقام 0-9، در مجموع 16 علامت استفاده می کند. A در هگز معادل 10 در اعشار است. F در هگز 15 در اعشار است.
کدهای رنگ Hex چگونه کار می کنند؟
در ابتدایی ترین شکل آن، کد هگز نشان دهنده مقدار قرمز، سبز و آبی در یک رنگ است. یک کد هگز از شش کاراکتر تشکیل شده است. دو رقم اول مربوط به مقدار رنگ قرمز در ترکیب است، دو رقم بعدی مربوط به مقدار سبز موجود است و دو رقم آخر نشان دهنده مقدار آبی است. کدهای هگز به رنگ های خاصی اشاره دارند و به طراحان و توسعه دهندگان این امکان را می دهند تا به راحتی در مورد طرح های رنگی ارتباط برقرار کنند.
با مقادیر 16 × 16 (256) برای هر جزء رنگ، 256 × 256 × 256 ترکیب ممکن وجود دارد. در هگز، آنها از #000000 (سیاه خالص) تا #FFFFFF (سفید خالص) متغیر هستند.
نحوه خواندن کدهای رنگ Hex
درک کدهای رنگ هگزا آسان است. بیایید مثال #FF5733 را در نظر بگیریم. ابتدا شش کاراکتر را به سه قسمت که هر کدام شامل دو کاراکتر است تقسیم کنید. همانطور که می دانید دو قسمت اول نشان دهنده قرمز، دو قسمت دوم نشان دهنده سبز و دو قسمت سوم نشان دهنده آبی است. بنابراین، در مثال ما:
- جزء قرمز، RR، دارای مقدار FF است.
- مولفه سبز، GG، 57 است.
- جزء آبی، BB، 33 است.
اکنون، برای یافتن شدت این بخش های رنگی، باید عدد هگزادسیمال را با استفاده از این سه مرحله محاسبه کنید:
- اولین کاراکتر هگزادسیمال RR را در 16 ضرب کنید. اگر کاراکتر یک حرف است، آن را به مقدار متناظر آن تبدیل کنید. در این مورد، اولین کاراکتر F است که 15 است. بنابراین، برای مثال ما، شما 15 × 16 را ضرب می کنید که برابر با 240 است.
- بعد، کاراکتر دوم RR را اضافه کنید. در صورت نیاز مجدداً یک حرف را به مقدار متناظر آن تبدیل کنید. در مثال ما، کاراکتر دوم F است که برابر با 15 است.
- پس از اتمام، مجموع ها را اضافه کنید تا یک مقدار واحد بدست آورید. اگر 240 و 15 را از مثال ما اضافه کنید، مقدار FF را 255 خواهید دید.
همین فرمول را برای دو بخش باقیمانده تکرار کنید، GG با 57 و BB نشان داده شده با 33. اگر محاسبات دستی خیلی طاقت فرسا به نظر می رسد، همیشه می توانید از یک ابزار تبدیل هگز به RGB (مانند تبدیل BinaryHex) برای خواندن یک رنگ استفاده کنید. باید متوجه شوید که مقدار هگز #FF5733 معادل rgb (255، 87، 51) است.
چرا کد رنگ Hex بسیار محبوب است؟
در حالی که چندین مدل رنگ مختلف (RGB، CMYK، HSL) وجود دارد، کدهای رنگ هگزا شاید پرکاربردترین نمایش باشد. این به این دلیل است که آنها ساده و قابل درک هستند.
فرمت با عرض ثابت نیز بسیار مفید است. رنگهای هگزادسیمال تمام طول همیشه هفت کاراکتر هستند، از جمله نماد # پیشرو.
رنگ های هگز بسیار کارآمد هستند و فقط از این هفت کاراکتر برای نمایش بیش از 16 میلیون رنگ استفاده می کنند. و تمایز بین این رنگ ها یک فرآیند ساده است.
Hex در مقابل RGB: آیا تفاوتی وجود دارد؟
سیستم کدگذاری رنگ RGB از سه عدد اعشاری برای نشان دادن شدت نسبی قرمز، سبز و آبی استفاده می کند. از ارقام 0-9 استفاده می کند.
Hex همچنین از سه عدد برای نشان دادن قرمز، سبز و آبی استفاده میکند، اما از ارقام اضافی (A-F) برای پاسخگویی به پایه 16 استفاده میکند. تفاوتی در رنگهای حاصل وجود ندارد، آنها فقط فرمتهای متفاوتی برای برقراری ارتباط یکسان هستند.
موارد مرتبط: اصول CSS: کار با رنگ ها
کد هگز برای چه مواردی استفاده می شود؟
برنامه های مختلف مختلفی از RGB، از صفحه نمایش تلویزیون گرفته تا دستگاه های تلفن همراه، بازی ها و علائم استفاده می کنند. شما عمدتاً کدهای رنگ هگز را در طراحی وب و سایر برنامه های گرافیکی مشاهده خواهید کرد.
همچنین ممکن است کدهای هگز را به عنوان روشی جهانی برای شناسایی رنگ ها ببینید. بسیاری از وبسایتها از آنها برای شناسایی یک رنگ خاص استفاده میکنند، زیرا کوتاه هستند و معمولاً از نظر بافتی بدون ابهام هستند.
کد رنگ Hex علم موشکی نیست
بنابراین، در اینجا شما اصول اولیه کدهای رنگ هگز را دارید. آنها دقیقاً علمی سخت نیستند، اما هدف مشخصی را در طراحی (و در دنیای فناوری) انجام می دهند. اگر به دنبال ابزاری هستید که به شما در درک نحوه عملکرد رنگهای هگزا کمک کند، یا ابزاری که در مورد تئوری ترکیب RGB به شما آموزش دهد، تعداد زیادی آنلاین وجود دارد. به یاد داشته باشید، کلید یادگیری هر چیز جدید این است که آن را یک قدم بردارید.
کدهای رنگ هگز هیجان انگیزترین چیز در جهان نیستند، اما اگر در زمینه طراحی وب کار می کنید، درک آنها حیاتی است. توانایی کار با کدهای رنگ هگزا کار طراحی شما را بسیار آسان تر می کند.