HTML Colors

HTML Colors का उपयोग web page के text, background, borders और other elements को visually attractive बनाने के लिए किया जाता है। HTML में colors directly define नहीं होते, बल्कि CSS properties के माध्यम से apply किए जाते हैं।

HTML में Color कैसे Apply किया जाता है?

HTML elements पर color apply करने के लिए CSS का use किया जाता है, अक्सर style attribute के साथ।

Example:

<p style="color:red;">Red Text</p>

HTML Color Names

HTML में कुछ predefined color names होते हैं।

Example:

<h2 style="color:blue;">Blue Heading</h2>
<p style="background-color:yellow;">Yellow Background</p>

Common color names:

  • red
  • blue
  • green
  • black
  • white
  • yellow
  • gray

HTML HEX Colors

HEX color एक hexadecimal code से define किया जाता है।

Format:

#RRGGBB

Example:

<p style="color:#FF0000;">Red Text</p>
  • RR – Red
  • GG – Green
  • BB – Blue

HTML RGB Colors

RGB का मतलब है Red, Green, Blue।

Format:

rgb(red, green, blue)

Example:

<p style="color:rgb(0, 128, 0);">Green Text</p>

Value range: 0 – 255

HTML RGBA Colors

RGBA में Alpha channel होता है जो transparency control करता है।

Example:

<p style="background-color:rgba(0,0,0,0.5);">Transparent Background</p>

Alpha value: 0.0 (transparent) से 1.0 (solid)

HTML HSL Colors

HSL का मतलब है:

  • Hue
  • Saturation
  • Lightness

Example:

<p style="color:hsl(240, 100%, 50%);">Blue Text</p>

HTML HSLA Colors

HSLA, HSL का advanced version है जिसमें alpha channel शामिल होता है।

Example:

<p style="background-color:hsla(120, 100%, 25%, 0.3);">HSLA Background</p>

Background Color

Background color apply करने के लिए background-color property use होती है।

Example:

<body style="background-color:lightgray;">

Text Color

Text color के लिए color property use होती है।

Example:

<p style="color:#333333;">Dark Text</p>

Border Color

Border color apply करने के लिए:

<p style="border:1px solid red;">Border Example</p>

Color Values और Accessibility

Accessible color usage के लिए:

  • Text और background में sufficient contrast रखें
  • Light text on light background avoid करें
  • Dark text on dark background avoid करें

Good color contrast readability और accessibility improve करता है।

HTML Colors और SEO

Colors direct SEO factor नहीं हैं, लेकिन:

  • Good readability user experience improve करती है
  • Better UX से bounce rate कम हो सकता है
  • Accessibility compliance SEO indirectly improve करता है

Common Beginner Mistakes

  • Too many colors use करना
  • Low contrast text
  • Inline styles का overuse
  • Random color selection

Quick Summary

  • HTML में colors CSS से apply होते हैं
  • Color names, HEX, RGB, HSL formats available हैं
  • RGBA और HSLA transparency support करते हैं
  • Accessibility के लिए contrast जरूरी है

Practice Questions

  1. HTML में colors कैसे apply किए जाते हैं?
  2. HEX और RGB color में difference क्या है?
  3. Alpha value क्या control करती है?

Share your love

Related Posts