แจกโค้ดสี สีพาสเทล สำหรับแต่งเว็บมากกว่า 100 สี นำไปใช้ได้เลย

แจกโค้ดสี โค้ดสีพาสเทล สำหรับแต่งเว็บ ทำงาน มากกว่า 100 สี

แจกโค้ดสี สีพาสเทล

สำหรับการทำรูป หรือข้อความ ถ้าเราใช้สีสันที่สวยงาม ก็จะเป้นส่วนที่ดึงดูดความสนใจผู้อ่านหรือคนที่เข้ามาดูได้เป็นอย่างดี ทีมงาน NotebookSPEC จึงจะมาแจกรหัสสี โค้ดสีพาสเทล ไว้สำหรับใช้งานกันง่าย ๆ เลย ไม่ต้องคอยนั่งหาสีตามเฉดด้วยตัวเอง อยากได้สีไหนก็สามารถคัดลอกโค้ดสีเหล่านี้ไป แล้วนำไปวางในช่องสำหรับใส่รหัสในโปรแกรมนั้น ๆ หรือแอพพลิเคชันที่เราใช้งานได้เลย


โค้ดสี

ก่อนที่เราจะไปดูโค้ดของสีแต่ละสีนั้น เรามาทำความรู้จักเกี่ยวกับรหัสสี หรือโค้ดของสีที่ใช้ในเว็บหรือคอมพิวเตอร์กันก่อนเลย

รหัสสี(Color Code) เกิดจากการผสมกันของ 3 แม่สีคือ แดง(Red), เขียว(Green) และน้ำเงิน(Blue) หรือที่นิยมเรียกว่า RGB โดยปรกติรหัสสีที่ใช้ในการเขียนโปรแกรมจะมีทั้งหมด 6 ตัวอักษรและต้องขึ้นต้นด้วยเครื่องหมาย # เสมอ ยกตัวอย่างเช่น aabbcc โดยที่ aa แทนด้วยรหัสสีแดง bb แทนด้วยรหัสสีเขียว และสุดท้าย cc แทนด้วยรหัสสีน้ำเงิน บางครั้งอาจใช้แค่ 3 ตัวอักษร คือ abc ก็ได้ แต่ความละเอียดของการผสมสีจะมีน้อยกว่า ซึ่งตัวอักษรแต่ละตัว แท้จริงแล้วก็คือค่าตัวเลขฐานสิบหก เริ่มต้นจาก 0 1 2 3 4 5 6 7 8 9 a b c d e f เนื่องจากว่าเราไม่สามารถที่จะเขียนเป็น 10 11 12 13 14 15 ได้ก็เลยใช้เป็นอักษรภาษาอังกฤษแทน

ที่ละเอียดที่สุดมากที่สุด มีให้เลือกแบบหลากหลายแบบ เหมาะสำหรับใช้ในการแต่งสีในโปรแกรมทุกโปรแกรม ตารางรหัสสี อ้างอิงตามเลขฐาน 16 ในรูปแบบ R G B หรือ รหัสผสมสีของ แดง-เขียว-น้ำเงิน ใช้ตัวเลข 0-9 และตัวหนังสือ A-F ได้สีมากถึง 14 ล้านสี 

(อ้างอิงข้อมูลจาก wikipedia)


โค้ดสีที่ใช้งานบ่อย

f1 1
#FFFFFF
f2 1
#FFFFCC
f3 1
#FFFF99
f4 1
#FFFF66
f5 1
#FFFF33
f6
#FFFF33
f7
#FFCCFF
f8
#FFCCCC
f9
#FFCC99
f10
#FFCC66
f11
#FFCC33
f12
#FFCC00
f13
#FF99FF
f14
#FF99CC
f15
#FF9999
f16
#FF9966
f17
#FF9933
f18
#FF9900
f19
#FF66FF
f20
#FF66CC
f21
#FF6699
f22
#FF6666
f23
#FF6633
f24
#FF6600
f25
#FF33FF
f26
#FF33CC
f27
#FF3399
f28
#FF3366
f29
#FF3333
f30
#FF3300
f31
#FF00FF
f32
#FF00CC
f33
#FF0099
f34
#FF0066
f35
#FF0033
f36
#FF0000
f37
#CCFFFF
f38
#CCFFCC
f39
#CCFF99
f40
#CCFF66
f41#CCFF33 f42#CCFF00
f43
#CCCCFF
f44
#CCCCCC
f45
#CCCC99
f46
#CCCC66
f47
#CCCC33
f48
#CCCC00
f49
#CC99FF
f50
#CC99CC
f51
#CC9999
f52
#CC9966
f53
#CC9933
f54
#CC9900
f55
#CC66FF
f56
#CC66CC
f57
#CC6699
f58
#CC6666
f59
#CC6633
f60
#CC6600
f61
#CC33FF
f62
#CC33CC
f63
#CC3399
f64
#CC3366
f65
#CC3333
f66
#CC3300
f67
#CC00FF
f68
#CC00CC
f69
#CC0099
f70
#CC0066
f71
#CC0033
f72
#CC0000
f73
#99FFFF
f74
#99FFCC
f75
#99FF99
f76
#99FF66
f77
#99FF33
f78
#99FF00
f79
#99CCFF
f80
#99CCFF
f81
#99CC99
f82
#99CC66
f83
#99CC33
f84
#99CC00
f85
#9999FF
f86
#9999CC
f87
#999999
f88
#999966
f89
#999933
f90
#999900
f91
#9966FF
f92
#9966CC
f93
#996699
f94
#996666
f95
#996633
f96
#996600
f97
#9933FF
f98
#9933CC
f99
#993399
f100
#993366
f101
#993333
f102
#993300
f103
#9900FF
f104
#9900CC
f105
#990099
f106
#990066
f107
#990033
f108
#990000
f109
#66FFFF
f110
#66FFCC
f111
#66FF99
f112
#66FF66
f113
#66FF33
f114
#66FF00
f115
#66CCFF
f116
#66CCCC
f117
#66CC99
f118
#66CC66
f119
#66CC33
f120
#66CC00
f121
#6699FF
f122
#6699CC
f123
#669999
f124
#669966
f125
#669933
f126
#669900
f127
#6666FF
f128
#6666CC
f129
#666699
f130
#666666
f131
#666633
f132
#666600
f133
#6633FF
f134
#6633CC
f135
#663399
f136
#663366
f137
#663333
f138
#663300
f139
#6600FF
f140
#6600CC
f141
#660099
f142
#660066
f143
#660033
f144
#660000
f145
#33FFFF
f146
#33FFCC
f147
#33FF99
f148
#33FF66
f149
#33FF33
f150
#33FF00
f151
#33CCFF
f152
#33CCCC
f153
#33CC99
f154
#33CC66
f155
#33CC33
f156
#FFCC00
f157
#3399FF
f158
#3399CC
f159
#339999
f160
#339966
f161
#339933
f162
#339900
f163
#3366FF
f164
#3366CC
f165
#336699
f166
#336666
f167
#336633
f168
#336600
f169
#3333FF
f170
#3333CC
f171
#333399
f172
#333366
f173
#333333
f174
#333300
f175
#3300FF
f176
#3300CC
f177
#330099
f178
#330066
f179
#330033
f180
#330000
f181
#00FFFF
f182
#00FFCC
f183
#00FF99
f184
#00FF66
f185
#00FF33
f186
#00FF00
f187
#00CCFF
f188
#00CCCC
f189
#00CC99
f190
#00CC66
f191
#00CC33
f192
#00CC00
f193
#0099FF
f194
#0099CC
f195
#009999
f196
#009966
f197
#009933
f198
#009900
f199
#0066FF
f200
#0066CC
f201
#006699
f202
#006666
f203
#006633
f204
#006600
f205
#0033FF
f206
#0033CC
f207
#003399
f208
#003366
f209
#003333
f210
#003300
f211
#0000FF
f212
#0000CC
f213
#000099
f214
#000066
f215
#000033
f216
#000000
โค้ดสี
Snow
#FFFAFA
GhostWhite
#F8F8FF
WhiteSmoke
#F5F5F5
Gainsboro
#DCDCDC
โค้ดสี
FloralWhite
#FFFAF0
OldLace
#FDF5E6
Linen
#FAF0E6
AntiqueWhite
#FAEBD7
โค้ดสี
PapayaWhip
#FFEFD5
BlanchedAlmond
#FFEBCD
Bisque
#FFFAF0
PeachPuff
#FFDAB9
โค้ดสี
NavajoWhite
#FFDEAD
Moccasin
#FFE4B5
Cornsilk
#FFF8DC
Ivory
#FFFFF0
โค้ดสี
LemonChiffon
#FFFACD
Seashell
#FFF5EE
Honeydew
#F0FFF0
MintCream
#F5FFFA
โค้ดสี
Azure
#F0FFFF
AliceBlue
#F0F8FF
lavender
#E6E6FA
Lavender Blush
#FFF0F5
โค้ดสี
MistyRose
#FFE4E1
White
#FFFFFF
Black
#000000
DarkSlateGray
#2F4F4F
โค้ดสี
LightSlateGray
#778899
Gray
#BEBEBE
LightGray
#D3D3D3
MidnightBlue
#191970
โค้ดสี
CornflowerBlue
#6495ED
DarkSlateBlue
#483D8B
SlateBlue
#6A5ACD
MediumSlateBlue
#7B68EE
โค้ดสี
LightSlateBlue
#8470FF
NavyBlue
#000080
DimGrey
#696969
SlateGrey
#708090
โค้ดสี
MediumBlue
#0000CD
RoyalBlue
#4169E1
Blue
#0000FF
DodgerBlue
1E90FF
โค้ดสี
DeepSkyBlue
#00BFFF
SkyBlue
#87CEEB
LightSkyBlue
#87CEFA
SteelBlue
#4682B4
โค้ดสี
LightSteelBlue
#B0C4DE
LightBlue
#ADD8E6
PowderBlue
#B0E0E6
PaleTurquoise
#AFEEEE
โค้ดสี
DarkTurquoise
#00CED1
MediumTurquoise
#48D1CC
Turquoise
#40E0D0
Cyan
#00FFFF
โค้ดสี
LightCyan
#E0FFFF
CadetBlue
#5F9EA0
MediumAquamarine
#66CDAA
Aquamarine
#7FFFD4
โค้ดสี
DarkGreen
#006400
DarkOliveGreen
#556B2F
DarkSeaGreen
#8FBC8F
SeaGreen
#2E8B57
โค้ดสี
MediumSeaGreen
#3CB371
LightSeaGreen
#20B2AA
PaleGreen
#98FB98
SpringGreen
#00FF7F
โค้ดสี
LawnGreen
#7CFC00
Green
#00FF00
Chartreuse
#7FFF00
MedSpringGreen
#00FA9A
โค้ดสี
GreenYellow
#ADFF2F
LimeGreen
#32CD32
YellowGreen
#9ACD32
ForestGreen
#228B22
โค้ดสี
OliveDrab
#6B8E23
DarkKhaki
#BDB76B
PaleGoldenrod
#EEE8AA
LtGoldenrodYello
#FAFAD2
โค้ดสี
LightYellow
#FFFFE0
Yellow
#FFFF00
Gold
#FFD700
LightGoldenrod
#EEDD82
โค้ดสี
Goldenrod
#DAA520
DarkGoldenrod
#B8860B
RosyBrown
#BC8F8F
IndianRed
#CD5C5C
โค้ดสี
SaddleBrown
#8B4513
Sienna
#A0522D
Peru
#CD853F
Burlywood
#DEB887
โค้ดสี
Beige
#F5F5DC
Wheat
#F5DEB3
SandyBrown
#F4A460
Tan
#D2B48C
โค้ดสี
Chocolate
#D2691E
Firebrick
#B22222
Brown
#A52A2A
DarkSalmon
#E9967A
โค้ดสี
Salmon
#FA8072
LightSalmon
#FFA07A
Orange
#FFA500
DarkOrange
#FF8C00
โค้ดสี
Coral
#FF7F50
LightCoral
#F08080
Tomato
#FF6347
OrangeRed
#FF4500
โค้ดสี
Red
#FF0000
HotPink
#FF69B4
DeepPink
#FF1493
Pink
#FFC0CB
โค้ดสี
MediumVioletRed
#C71585
VioletRed
#D02090
Magenta
#FF00FF
Violet
#EE82EE
โค้ดสี
Plum
#DDA0DD
LightPink
#FFB6C1
PaleVioletRed
#DB7093
Maroon
#B03060
โค้ดสี
Orchid
#DA70D6
MediumOrchid
#BA55D3
DarkOrchid
#9932CC
DarkViolet
#9400D3
โค้ดสี
BlueViolet
#8A2BE2
Purple
#A020F0
MediumPurple
#9370DB
Thistle 
#D8BFD8

โค้ดสีพาสเทล

สำหรับสีพาสเทลกับการใช้ใน Social Media ต่าง ๆ นั้น โดยส่วนใหญ่แล้วจะนำมาแต่งรูป หรือใส่สีเข้าไปเพื่อให้รูปนั้นดูมีความอ่อนโยน มองแล้วสบายตา และดูละมุนขึ้น และที่ฮิตที่สุดก็เห็นจะเป็นการนำสีเหล่านี้ เข้าไปใส่เป็น BG (Background) หรือพื้นหลังใน Story IG ไม่ก็ดูดสีไปใส่พื้นหลังข้อความ หรือตัวข้อความเองเลยก็มี แล้วแต่ว่าจะนำไปใช้ทำอะไร

สีพาสเทลคืออะไร?

เรามาทำความรู้จักกับสีพาสเทลกันก่อนเล็กน้อย เผื่อใครยังไม่รู้ว่านอกจากความสวยของตัวสีแล้ว มันมีประโยชน์อย่างไรอีกบ้าง ความจริงแล้วสีแบบพาสเทล ก็คือการนำสีที่เป็นแม่สี หรือสีต่างๆ มาผสมเข้ากับสีขาว และความเข้มก็จะดูลดลง พูดภาษาชาวบ้าน ก็คือการทำให้สีเดิมอ่อนลงนั่นเอง นอกจากความสวยของสีที่อ่อนลงแล้ว สีเหล่านี้ยังไปกระตุ้นต่อมไพเนียล (Pineal Gland) ของสมอง ที่ส่งผลต่อความรู้สึก ฮอร์โมน และจิตใจด้วย จึงทำให้เมื่อเราเห็นสีแบบพาสเทลแล้ว จะทำให้รู้สึกสบายตาสบายใจ และผ่อนคลายตามไปด้วย จึงไม่แปลกใจว่าทำไมคนส่วนใหญ่ถึงชอบใช้พาสเทลกัน

สำหรับโค้ดสีพาสเทลที่เราจะเอามาแนะนำนั้น จะมีอยู่หลายเฉดสีที่ต่างกันไป รวมไปถึงโทนที่ต่างกันออกไปด้วย ใครอยากนำไปใช้งาน ก็สามารถก็อปโค้ดสีพาสเทล รหัส Hex หรือง่ายกว่านั้นก็ดูดสีไปใช้กันได้เลย ส่วนโค้ดสีพาลเทลนั้นก็จะเรียงกันตามลำดับของสี

โค้ดสีพาสเทล
#46302B #76504F #D4CCCA #A37E7E #86736C
โค้ดสีพาสเทล
#99BBAD #EBD8B7 #C6A9A3 #FDFFBC #9A8194
โค้ดสีพาสเทล
#C6AC84 #E2E5CC #D9C2BD #A2C4C6 #82B2B7
โค้ดสีพาสเทล
#252B31 #5E6668 #C1C8C7 #F6FAFB #D49C6B
โค้ดสีพาสเทล
#8EA4C9 #C3B8AA #DEDCE5 #DB93A6 #C7CCC5
โค้ดสีพาสเทล
#BBEAA6 #E3C878 #ED9A73 #E688A1 #F14668
โค้ดสีพาสเทล
#845EC2 #FFC75F #F9F871 #FF5E78 #413C69
โค้ดสีพาสเทล
#CAE7E3 #B2B2B2 #EEB8C5 #DCDBD9 #FEC7BB
โค้ดสีพาสเทล
#FF9292 #FFB4B4 #FFDCDC #FFE8E8 #4A3933
โค้ดสีพาสเทล
#E9BBB5 #E7CBA8 #AAD9CE #E8D595 #8DA47E
โค้ดสีพาสเทล
#9C4B28 #E4815D #FDB195 #FFD1BB #FFFAF6
โค้ดสีพาสเทล
#45654F #7F9E99 #E6F1EF #F9FAFC #D5A594
โค้ดสีพาสเทล
#362C1D #406E1C #816E25 #C9C94B #CED19F
โค้ดสีพาสเทล
#218B81 #9AD9DB #E5DBD9 #98D4BB #EB96AB
โค้ดสีพาสเทล
#698396 #A9C8C0 #DBBC8E #AE8A8C #7C98AB
โค้ดสีพาสเทล
#5D4B63 #A38182 #CECBDA #F6E5E4 #D74D63
โค้ดสีพาสเทล
#DDF2F4 #84A6D6 #4382BB #E4CEE0 #A15D98
โค้ดสีพาสเทล
#191F1D #345C56 #C85E6C #C43D56 #600318
โค้ดสีพาสเทล
#F4656D #008EB3 #A7E5E0 #E4DBBE #BB8F5B
โค้ดสีพาสเทล
#537C8E #2EBDBD #EFF1E4 #CEAE7F #85583F

ตัวอย่าง การใช้งานโค้ดสีบน IG Story

สำหรับการนำสีเหล่านี้ ไปใช้บน Story IG (Instagram) บนระบบ Android นั้นไม่สามารถทำได้ เนื่องจากทาง Instagram ไม่ได้อนุญาตให้เรากดแทรกรูปเข้าไปใน Story ได้ จะทำได้เพียงแค่การถ่ายรูปอย่างเดียว ถ้าถ่ายรูปจากหน้าจอคอม หรือหน้าจอมือถืออีกเครื่องก็พอได้อยู่ แต่เป็นวิธีที่ยุ่งยาก และไม่สามารถทำได้หากอยู่คนเดียว ส่วนที่ทำได้อย่างแน่นอนเลยก็คือบนระบบ iOS ที่สามารถแทรกรูปภาพจากอัลบัมเข้าไปได้เลย และการใช้สีเหล่านี้ จะเปลี่ยนได้แค่เพียงสีของตัวอักษรที่พิมพ์ หรือเขียน กับพื้นหลังของตัวอักษรอย่างเดียว มีวิธีทำดังนี้

การใช้งานโค้ดสีบน IG Story
  • กดแคปหน้าจอสีที่ต้องการนำไปใช้ และเข้าไปยังแอพพลิเคชัน Instagram >> เลือกถ่าย IG Story จากนั้นก็พิมพ์ข้อความตามปกติ
  • กดเข้าไปที่ไอคอนการแปะสติกเกอร์ แล้วเลือกเมนูแทรกรูป (จะเป็นรูปที่อยู่ในอัลบั้มมือถือ) จากนั้นจึงเลือกรูปสีที่แคปหน้าจอเปิดเข้ามาใน IG Story
  • กดที่ตัวหนังสือที่พิมพ์เอาไว้ จากนั้นเลือกไอคอนเปลี่ยนสี และกดเครื่องมือดูดสี และเลื่อนตัวดูดสีไปยังสีที่ต้องการ จากรูปที่ได้แคปหน้าจอมา เมื่อได้สีที่ต้องการแล้ว ก็ลบรูปที่แทรกเข้ามา เพียงเท่านี้ก็จะสามารถเลือกสีได้ตามใจชอบแล้ว

และทั้งหมดนี้ก็เป็นโค้ดสีที่ใช้งานบ่อย รวมไปถึงโค้ดสีพาสเทล และตัวอย่างการใช้งาน เช่น การเปลี่ยนสีตัวหนังสือบน Story IG ง่าย ๆ ซึ่งแต่ละโทนสีก็จะมีความแตกต่างกันไป ขึ้นอยู่กับว่าจะนำไปใช้กับอะไรให้เข้ากัน หรือถ้าจะนำไปใช้กับงานอื่น ๆ อย่างการนำเสนองาน หรือทำเรซูเม่ให้สวย ๆ ก็ทำได้เหมือนกันนะ สามารถก็อปปี้โค้ดสีไปใช้กันได้เลย


อ่านบทความเพิ่มเติม/เนื้อหาที่เกี่ยวข้อง

10 เว็บแจกรูปภาพฟรี
โหลดวีดีโอจาก Facebook
ทำ GIF

from:https://notebookspec.com/web/585757-free-color-codes-for-website-and-others