CSS

1. CSS Home 2. CSS Introduction 3. CSS Versions 4. CSS Extension 5. Adv.& Disadv of CSS 6. HTML v/s CSS 7. CSS Syntax 8. CSS Selector 9. Inserting CSS file 10. Class 11. ID 12. Div 13. Font 14. Font-size 15. Font-weight 16. Font-style 17. Font-variant 18. Text 19. Text-color 20. Text-decoration 21. Text-transform 22. Text-indent 23. CSS Color 24. Web Safe Color 25. Background-image 26. Background-repeat 27. Background-position 28. Background-attachment 29. Background-size 30. Background-origin 31. CSS Box Model 32. Padding 33. Padding-top 34. Padding-right 35. Padding-bottom 36. Padding-left 37. Margin 38. Margin-top 39. Margin-right 40. Margin-bottom 41. Margin-left 42. Margin Demonstration 43. Border 44. Border-style 45. Different Border-style 46. Border-width 47. Different Border-width 48. Border-color 49. Border-radius 50. Border-collapse 51. Border-spacing 52. Border-image 53. Border-bottom 54. Border-bottom-style 55. Border-bottom-width 56. Border-bottom-color 57. Border-bottom-left-radius 58. Border-bottom-right-radius 59. Border-top 60. Border-top-style 61. Border-top-width 62. Border-top-color 63. Border-top-left-radius 64. Border-top-right-radius 65. Border-right 66. Border-right-style 67. Border-right-width 68. Border-right-color 69. Border-left 70. Border-left-style 71. Border-left-width 72. Border-left-color 73. Ex.Padding,Border,Margin 74. List Style 75. List Style-type 76. List Style-position 77. List Style-image 78. Dimension Properties 79. Width 80. Max-width 81. Min-width 82. Height 83. Max-height 84. Min-height 85. Grouping Selector 86. Nesting Selector 87. Floating 88. Position 89. Pseudo Element 90. First-letter Pseudo 91. First-line-Pseudo 92. Before & After Pseudo 93. Pseudo-class Selector 94. tag 95. Image Gallery 96. Scrollbars 97. Display Property 98. Cursor Property 99. Caption-side Property 100. Transform Property 101. Interview Question and Answer part 1 102. Interview Question and Answer part 2 103. Interview Question and Answer part 3 104. Interview Question and Answer part 4 105. Interview Question and Answer part 5 106. Interview Question and Answer part 6 107. Interview Question and Answer part 7 108. Interview Question and Answer part 8
Pr.Pg Next Pg

Web safe colors tutorials

  • Few years back, computer could display only (28 i.e. 8 bits) 256 colors.

  • During same time following 216 safe web colors were used.

  • 256 216 = 40 colors left were used by system.

  • However today, most computers can display millions of colors.

  • According to your computer resolution, it will display colors as follows.

 

Color Bits

Total number of colors supported

4 bits

16 colors

8 bits

256 colors

16 bits

65,536 colors

24 bits

16,777,216 colors

32 bits

4,294,967,297 colors

 

216 Web safe colors

 

000000

000033

000066

000099

0000CC

0000FF

003300

003333

003366

003399

0033CC

0033FF

006600

006633

006666

006699

0066CC

0066FF

009900

009933

009966

009999

0099CC

0099FF

00CC00

00CC33

00CC66

00CC99

00CCCC

00CCFF

00FF00

00FF33

00FF66

00FF99

00FFCC

00FFFF

330000

330033

330066

330099

3300CC

3300FF

333300

333333

333366

333399

3333CC

3333FF

336600

336633

336666

336699

3366CC

3366FF

339900

339933

339966

339999

3399CC

3399FF

33CC00

33CC33

33CC66

33CC99

33CCCC

33CCFF

33FF00

33FF33

33FF66

33FF99

33FFCC

33FFFF

660000

660033

660066

660099

6600CC

6600FF

663300

663333

663366

663399

6633CC

6633FF

666600

666633

666666

666699

6666CC

6666FF

669900

669933

669966

669999

6699CC

6699FF

66CC00

66CC33

66CC66

66CC99

66CCCC

66CCFF

66FF00

66FF33

66FF66

66FF99

66FFCC

66FFFF

990000

990033

990066

990099

9900CC

9900FF

993300

993333

993366

993399

9933CC

9933FF

996600

996633

996666

996699

9966CC

9966FF

999900

999933

999966

999999

9999CC

9999FF

99CC00

99CC33

99CC66

99CC99

99CCCC

99CCFF

99FF00

99FF33

99FF66

99FF99

99FFCC

99FFFF

CC0000

CC0033

CC0066

CC0099

CC00CC

CC00FF

CC3300

CC3333

CC3366

CC3399

CC33CC

CC33FF

CC6600

CC6633

CC6666

CC6699

CC66CC

CC66FF

CC9900

CC9933

CC9966

CC9999

CC99CC

CC99FF

CCCC00

CCCC33

CCCC66

CCCC99

CCCCCC

CCCCFF

CCFF00

CCFF33

CCFF66

CCFF99

CCFFCC

CCFFFF

FF0000

FF0033

FF0066

FF0099

FF00CC

FF00FF

FF3300

FF3333

FF3366

FF3399

FF33CC

FF33FF

FF6600

FF6633

FF6666

FF6699

FF66CC

FF66FF

FF9900

FF9933

FF9966

FF9999

FF99CC

FF99FF

FFCC00

FFCC33

FFCC66

FFCC99

FFCCCC

FFCCFF

FFFF00

FFFF33

FFFF66

FFFF99

FFFFCC

FFFFFF

 

CSS Short Hex Code:

  • Short Hex Code is a shorter form of the six-digit notation. In this format, each digit is replicated to arrive at an equivalent six-digit value; For example: #F00 becomes #FF0000.

  • Nearly all browsers (version 3 and above, except IE3 Mac) support shorthand hex colors.

  • Each hexadecimal code will be preceded by a pound or hash sign #. RGB triplets can be abbreviated if each of the Red, Green, and Blue hex pairs are the same. So when you use colors where there are three pairs, you can abbreviate each color channel using one character instead of two identical characters.

  • Browsers automatically expand these three-character colors into six by replicating the R, G, and B values. This technique saves a few bytes for each color abbreviated with shorthand hex notation.

 

Color name

Short Hex color code

Black

#000

Red

#F00

Green

#0F0

Blue

#00F

White

#FFF

 

Example: Program to demonstrate CSS Short Hex color code
Output:

CSS RGB Values:

  • This color value is specified using the rgb( ) property. This property takes three values, one each for red, green, and blue. The value can be an integer between 0 and 255.

NOTE: All the browsers does not support rgb() property of color so it is recommended not to use it.

  • Following is the example to show few colors Name using RGB values.

Color name

Color RGB

Black

rgb(0,0,0)

Red

rgb(255,0,0)

Green

rgb(0,255,0)

Blue

rgb(0,0,255)

White

rgb(255,255,255)

 

Example: Program to demonstrate CSS color RGB values
Output:

CSS RGB %

  • The syntax of RGB% is rgb(rrr%,ggg%,bbb%) in percentage of Red, Green and Blue.

 

Example: Following example shows the use of CSS RGB% color.
Output:

CSS Color Keyword:

  • We can specify various color using keyword as follows

 

Color keyword name

RRGGBB value

Color example

Aqua

#00FFFF

 

Black

#000000

 

Blue

#0000FF

 

Fuchsia

#FF00FF

 

Gray

#808080

 

Green

#00FF00

 

Lime

#008000

 

Maroon

#800000

 

Navy

#000080

 

Olive

#808000

 

Purple

#800080

 

Red

#FF0000

 

Silver

#COCOCO

 

Teal

#008080

 

White

#FFFFFF

 

Yellow

#FFFF00

 

 

Example: Following example shows the use of CSS color name.
Output:
Pr.Pg border                                              Next Pg