HTML HEX Colors การใช้งานสีแบบ HEX ใน HTML

ใน HTML เราสามารถใช้งานสีโดยการระบุรหัสสีเป็นตัวเลขฐานสิบหก ในรูปแบบ #rrggbb โดยที่ rr หมายถึงสีแดง (Red) ส่วน gg หมายถึงสีเขียว (Green) และ bb หมายถึงสีน้ำเงิน (Blue)

และสามารถระบุค่าตัวเลขฐานสิบหกให้สีแต่ละสีได้ตั้งแต่ค่า 00 จนถึง ff เช่น #ff0000 หมายถึง สีแดง เพราะค่าสีแดง rr ถูกกำหนดให้เป็นค่าสูงสุดคือ ff ส่วนค่าสีอื่น ๆ ถูกกำหนดให้เป็น 00 จึงทำให้ได้สีออกมาเป็นสีแดงอย่างเดียว

ตัวอย่างการกำหนดค่าสีแบบ HEX

<h1 style="background-color:#ff0000;">#ff0000</h1>
<h1 style="background-color:#0000ff;">#0000ff</h1>
<h1 style="background-color:#3cb371;">#3cb371</h1>
<h1 style="background-color:#ee82ee;">#ee82ee</h1>
<h1 style="background-color:#ffa500;">#ffa500</h1>
<h1 style="background-color:#6a5acd;">#6a5acd</h1>

สีที่ได้จากโค้ดด้านบน

#ff0000

#0000ff

#3cb371

#ee82ee

#ffa500

#6a5acd

ส่วนโทนสีเทา จะได้จากการกำหนดค่าให้แต่ละสีมีค่าเท่ากัน เช่น

<h1 style="background-color:#000000;">#000000</h1>
<h1 style="background-color:#3c3c3c;">#3c3c3c</h1>
<h1 style="background-color:#787878;">#787878</h1>
<h1 style="background-color:#b4b4b4;">#b4b4b4</h1>
<h1 style="background-color:#f0f0f0;">#f0f0f0</h1>
<h1 style="background-color:#ffffff;">#ffffff</h1>

สีที่ได้จากโค้ดด้านบน

#000000

#3c3c3c

#787878

#b4b4b4

#f0f0f0

#ffffff

ตัวอย่างสีและรหัสสีแบบ HEX

#CD5C5C

#F08080

#FA8072

#E9967A

#FFA07A

#DC143C

#FF0000

#B22222

#8B0000

#FFC0CB

#FFB6C1

#FF69B4

#FF1493

#C71585

#DB7093

#FFA07A

#FF7F50

#FF6347

#FF4500

#FF8C00

#FFA500

#FFD700

#FFFF00

#FFFFE0

#FFFACD

#FAFAD2

#FFEFD5

#FFE4B5

#FFDAB9

#EEE8AA

#F0E68C

#BDB76B

#E6E6FA

#D8BFD8

#DDA0DD

#EE82EE

#DA70D6

#FF00FF

#BA55D3

#9370DB

#663399

#8A2BE2

#9400D3

#9932CC

#8B008B

#800080

#4B0082

#6A5ACD

#483D8B

#7B68EE

#ADFF2F

#7FFF00

#7CFC00

#00FF00

#32CD32

#98FB98

#90EE90

#00FA9A

#00FF7F

#3CB371

#2E8B57

#228B22

#008000

#006400

#9ACD32

#6B8E23

#808000

#556B2F

#66CDAA

#8FBC8B

#20B2AA

#008B8B

#008080

#00FFFF

#E0FFFF

#AFEEEE

#7FFFD4

#40E0D0

#48D1CC

#00CED1

#5F9EA0

#4682B4

#B0C4DE

#B0E0E6

#ADD8E6

#87CEEB

#87CEFA

#00BFFF

#1E90FF

#6495ED

#000000

#4169E1

#0000FF

#0000CD

#00008B

#000080

#191970

#FFF8DC

#FFEBCD

#FFE4C4

#FFDEAD

#F5DEB3

#DEB887

#D2B48C

#BC8F8F

#F4A460

#DAA520

#B8860B

#CD853F

#D2691E

#8B4513

#A0522D

#A52A2A

#800000

#FFFFFF

#FFFAFA

#F0FFF0

#F5FFFA

#F0FFFF

#F0F8FF

#F8F8FF

#F5F5F5

#FFF5EE

#F5F5DC

#FDF5E6

#FFFAF0

#FFFFF0

#FAEBD7

#FAF0E6

#FFF0F5

#FFE4E1

#DCDCDC

#D3D3D3

#C0C0C0

#A9A9A9

#808080

#696969

#778899

#708090

#2F4F4F

HTML HEX Colors การใช้งานสีแบบ HEX ใน HTML

HTML HEX Colors การใช้งานสีแบบ HEX ใน HTML

ตัวอย่างการกำหนดค่าสีแบบ HEX

#ff0000

#0000ff

#3cb371

#ee82ee

#ffa500

#6a5acd

#000000

#3c3c3c

#787878

#b4b4b4

#f0f0f0

#ffffff

ตัวอย่างสีและรหัสสีแบบ HEX

เขียนโปรแกรมภาษา Python ตอนที่ 139 การใช้ for loop

วิธีสร้างบาร์โค้ดใน Excel

การใช้งานฟังก์ชัน LEFT ใน Excel

แปลงตัวอักษรทั้งหมดเป็นตัวพิมพ์เล็กแต่ให้ตัวอักษรแรกเป็นตัวพิมพ์ใหญ่ใน Excel

HTML HEX Colors การใช้งานสีแบบ HEX ใน HTML

ตัวอย่างการกำหนดค่าสีแบบ HEX

#ff0000

#0000ff

#3cb371

#ee82ee

#ffa500

#6a5acd

#000000

#3c3c3c

#787878

#b4b4b4

#f0f0f0

#ffffff

ตัวอย่างสีและรหัสสีแบบ HEX

คุณอาจสนใจ: