RGB നിങ്ങളുടെ കൈയിൽ 0–255 വരെ ഉള്ള മൂന്ന് ദശലക്ഷ്യ ചാനലുകൾ നൽകുന്നു. HEX-ലേക്ക് മാറ്റം ഓരോ ചാനലും രണ്ട്-അങ്കി ഹെക്സഡെസിമൽ നമ്പറായി മാറ്റി, മുഴുവൻ കളർ ഒരു സംക്ഷിപ്ത ടോക്കണിൽ ഫിറ്റ് ചെയ്യുന്നതിനും എല്ലാ ബ്രൗസറുകളും design tool-കളും സ്റ്റൈൽ ഗൈഡുകളും തിരിച്ചറിയുന്നതിനും സഹായിക്കുന്നു.
RGB നിന്ന് HEX വരെ മാറ്റം എങ്ങനെ നടക്കുന്നു
- ചുവപ്പ് ചാനൽ എടുത്ത് അതിനെ 16 കൊണ്ട് ഹരിക്കുക: ഹരണഫലം ആദ്യ അക്കവും ശിഷ്ടം രണ്ടാം അക്കവുമാണ്.
- 10 മുതൽ 15 വരെയുള്ള അക്കങ്ങളെ A മുതൽ F വരെ അക്ഷരങ്ങളായി എഴുതുക — 255 FF ആകും.
- അർദ്ധനമാകുന്നില്ലാത്ത പച്ചയും നീലയും ആവർത്തിക്കുക; ഒറ്റ അക്കങ്ങൾ മുന്നിൽ 0 ചേർത്ത് പൂരിപ്പിക്കുക: 5 → 05.
- മൂന്ന് ജോഡികൾ ചേർത്ത് മുന്പ് ഒരു # വയ്ക്കുക.
പ്രായോഗിക ഉദാഹരണം
ചാനലുകൾ 0 മുതൽ 255 വരെയുള്ള പൂർണ്ണസംഖ്യകളാണെങ്കിൽ ഇത് കൃത്യമാണ്. rgb(79.5, 70, 229) പോലെയുള്ള ദശാംശ മൂല്യങ്ങൾ ആദ്യം അടുത്തുള്ള പൂർണ്ണസംഖ്യയിലേക്ക് റൗണ്ട് ചെയ്യുന്നു, കാരണം HEX-ന് അതിനിടയിലുള്ള മൂല്യങ്ങൾ സൂക്ഷിക്കാനാവില്ല.
RGBയും HEXയും വിശദീകരിച്ചത്
RGB എന്താണ്?
RGB ഒരു കളർ മൂന്ന് ലൈറ്റ് ചാനലുകളായി വിവരിക്കുന്നു — red, green, blue — ഓരോത് 0–255 വരെയാണ്. ഇത് സ്ക്രീനുകൾ എങ്ങനെ പ്രവർത്തിക്കുന്നു എന്നതിനെ പ്രതിഫലിപ്പിക്കുന്നു: മൂന്നു ചാനലുകളും 255 ആയാൽ വെള്ള, എല്ലാ ചാനലുകളും 0 ആണെങ്കിൽ കറുപ്പ്. കളറുമായി കണക്കുകൾ ചെയ്യേണ്ടപ്പോഴെല്ലാം RGB അനുയോജ്യമാണ്, rgba() വഴി transparency ചേർക്കാനും കഴിയും.
- Syntax:
- rgb(R, G, B)
- Range:
- ഒരു ചാനലിന് 0–255
- Best for:
- code, canvas, rgba() ഉപയോഗിച്ച് transparency
HEX എന്താണ്?
മുന്നിൽ # ചിഹ്നമുള്ള ആറക്ക ഹെക്സാഡെസിമൽ സംഖ്യയാണ് HEX കോഡ്. ഇത് ഒരു നിറത്തിന്റെ റെഡ്, ഗ്രീൻ, ബ്ലൂ ചാനലുകൾ സംഭരിക്കുന്നു. ഓരോ ജോഡി അക്കങ്ങളും ഒരു ചാനലിനെ പ്രതിനിധീകരിക്കുന്നു, 00 (ഒന്നുമില്ല) മുതൽ FF (പൂർണ്ണം) വരെ. RGB-യുടെ അതേ 16.7 ദശലക്ഷം നിറങ്ങൾ ഇത് കൂടുതൽ ചെറിയ രൂപത്തിൽ നൽകുന്നു. CSS, ഡിസൈൻ ടൂളുകൾ, ബ്രാൻഡ് ഗൈഡ്ലൈനുകൾ എന്നിവയിൽ HEX ആണ് സ്ഥിരസ്ഥിതി.
- Syntax:
- #RRGGBB
- Range:
- ഒരു ചാനലിന് 00–FF
- Best for:
- CSS, design handoff, brand guidelines
RGB to HEX reference table
സാധാരണയായി ഉപയോഗിക്കുന്ന CSS നിറങ്ങൾ RGB ൽ നിന്ന് HEX ആയി പരിവർത്തനം ചെയ്തിരിക്കുന്നു.
| നിറം | RGB | HEX |
|---|---|---|
| black | rgb(0, 0, 0) | #000000 |
| white | rgb(255, 255, 255) | #FFFFFF |
| red | rgb(255, 0, 0) | #FF0000 |
| lime | rgb(0, 255, 0) | #00FF00 |
| blue | rgb(0, 0, 255) | #0000FF |
| yellow | rgb(255, 255, 0) | #FFFF00 |
| orange | rgb(255, 165, 0) | #FFA500 |
| teal | rgb(0, 128, 128) | #008080 |
| purple | rgb(128, 0, 128) | #800080 |
| gray | rgb(128, 128, 128) | #808080 |