Κωδικός λιλά. Εκμάθηση HTML. Χρώματα RGB. Ασφαλή χρώματα παλέτας. Χρώματα CSS - Τιμές RGB
Πίνακας (παλέτα) χρωμάτων htmlσας δίνει την ευκαιρία να επιλέξετε ανεξάρτητα τον τόνο που χρειάζεστε. Η τιμή χρώματος εμφανίζεται σε τρεις μορφές: Hex, RGB και HSV.
- Το Hex αποτελείται από τρεις τιμές δύο χαρακτήρων στο δεκαεξαδικό σύστημα αριθμών. Για παράδειγμα: #ff00b3, όπου το πρώτο ζεύγος αριθμών είναι κόκκινο, το δεύτερο είναι πράσινο και το τρίτο είναι μπλε.
- Το RGB (RedGreenBlue) έχει τη μορφή "200.100.255", υποδεικνύοντας την ποσότητα του αντίστοιχου τόνου (κόκκινο, πράσινο, μπλε) στο χρώμα που προκύπτει.
- HSV (Hue, Saturation, Value - tone, saturation, value) - ένα χρωματικό μοντέλο στο οποίο οι συντεταγμένες είναι:
- Απόχρωση - χρωματικός τόνος, μπορεί να ποικίλλει από 0° έως 360°.
- Κορεσμός - κορεσμός, κυμαίνεται από 0-100 ή 0-1. Όσο υψηλότερη είναι αυτή η παράμετρος, τόσο πιο «καθαρό» είναι το χρώμα, γι' αυτό και αυτή η παράμετρος ονομάζεται μερικές φορές καθαρότητα χρώματος. Και όσο πιο κοντά είναι αυτή η παράμετρος στο μηδέν, τόσο πιο κοντά είναι το χρώμα στο ουδέτερο γκρι.
- Τιμή (τιμή χρώματος) - ορίζει τη φωτεινότητα, η τιμή μπορεί επίσης να κυμαίνεται μεταξύ 0-100 ή 0-1.
Εισαγάγετε τον κωδικό χρώματος: ΠΗΓΑΙΝΩ
Λίστα χρωμάτων με ονόματα
Ο πίνακας παραθέτει τα αγγλικά ονόματα χρωμάτων (τα οποία μπορούν να χρησιμοποιηθούν ως τιμές) που υποστηρίζονται από όλα τα προγράμματα περιήγησης και τις δεκαεξαδικές τιμές τους. Όλα τα χρώματα που αναφέρονται είναι "ασφαλή", που σημαίνει ότι θα εμφανίζονται τα ίδια σε όλα τα προγράμματα περιήγησης.
Όνομα χρώματος | ΓΟΗΤΕΥΩ | Χρώμα |
---|---|---|
Μαύρος | #000000 | |
ΠΟΛΕΜΙΚΟ ΝΑΥΤΙΚΟ | #000080 | |
Σκούρο μπλε | #00008B | |
Μεσαίο μπλε | #0000CD | |
Μπλε | #0000FF | |
Σκούρο πράσινο | #006400 | |
Πράσινος | #008000 | |
Βάσκας | #008080 | |
DarkCyan | #008B8B | |
DeepSkyBlue | #00BFFF | |
Σκούρο Τιρκουάζ | #00CED1 | |
MediumSpringGreen | #00FA9A | |
Ασβεστος | #00FF00 | |
SpringGreen | #00FF7F | |
Aqua | #00FFFF | |
κυανό | #00FFFF | |
Midnight Blue | #191970 | |
DodgerBlue | #1E90FF | |
LightSeaGreen | #20B2AA | |
Πράσινο του δάσους | #228B22 | |
Πράσινη θάλασσα | #2E8B57 | |
DarkSlateGray | #2F4F4F | |
Ασβεστοπράσινο | #32CD32 | |
MediumSeaGreen | #3CB371 | |
Τουρκουάζ | #40E0D0 | |
Μπλε ρουά | #4169E1 | |
SteelBlue | #4682B4 | |
DarkSlateBlue | #483D8B | |
Μεσαίο Τυρκουάζ | #48D1CC | |
Ινδικό | #4B0082 | |
DarkOliveGreen | #556B2F | |
CadetBlue | #5F9EA0 | |
CornflowerBlue | #6495ΕΔ | |
MediumAquaMarine | #66CDAA | |
DimGray | #696969 | |
SlateBlue | #6A5ACD | |
OliveDrab | #6B8E23 | |
Γκρι Σχιστόλιθος | #708090 | |
LightSlateGray | #778899 | |
MediumSlateBlue | #7B68EE | |
LawnGreen | #7CFC00 | |
Κιτρινοπράσινος | #7FFF00 | |
Ακουαμαρίνης | #7FFFD4 | |
Μαρόν | #800000 | |
Μωβ | #800080 | |
Ελιά | #808000 | |
Γκρί | #808080 | |
SkyBlue | #87CEEB | |
LightSkyBlue | #87 CEFA | |
Μπλε βιολετί | #8A2BE2 | |
Σκούρο κόκκινο | #8B0000 | |
DarkMagenta | #8B008B | |
SaddleBrown | #8B4513 | |
DarkSeaGreen | #8FBC8F | |
Ανοιχτό πράσινο | #90EE90 | |
MediumPurple | #9370D8 | |
DarkViolet | #9400D3 | |
Απαλό πράσινο | #98FB98 | |
Σκοτεινή Ορχιδέα | #9932CC | |
Κίτρινο πράσινο | #9ACD32 | |
Χώμα σιένης | #A0522D | |
καφέ | #A52A2A | |
Σκούρο γκρίζο | #A9A9A9 | |
Γαλάζιο | #ADD8E6 | |
Πράσινο κίτρινο | #ADFF2F | |
PaleTurquoise | #ΑΦΕΕΕΕ | |
Light SteelBlue | #B0C4DE | |
Μπλε σκόνη | #B0E0E6 | |
Πυρίμαχο τούβλο | #B22222 | |
DarkGoldenRod | #B8860B | |
MediumOrchid | #BA55D3 | |
Ρόζι Μπράουν | #BC8F8F | |
Σκούρο Χακί | #BDB76B | |
Ασήμι | #C0C0C0 | |
MediumVioletRed | #C71585 | |
IndianRed | #CD5C5C | |
Περού | #CD853F | |
Σοκολάτα | #D2691E | |
Βυρσοδέψω | #D2B48C | |
Ανοιχτό γκρι | #D3D3D3 | |
PaleVioletRed | #D87093 | |
Γαϊδουράγκαθο | #D8BFD8 | |
Ορχιδέα | #DA70D6 | |
GoldenRod | #DAA520 | |
βυσσινί | #DC143C | |
Gainsboro | #DCDCDC | |
Δαμάσκηνο | #DDA0DD | |
BurlyWood | #DEB887 | |
Ανοιχτόκυανό | #E0FFFF | |
Λεβάντα | #E6E6FA | |
DarkSalmon | #E9967A | |
Βιολέτα | #EE82EE | |
PaleGoldenRod | #EEE8AA | |
LightCoral | #F08080 | |
Χακί | #F0E68C | |
Άλις Μπλου | #F0F8FF | |
HoneyDew | #F0FFF0 | |
Γαλανός | #F0FFFF | |
SandyBrown | #F4A460 | |
Σιτάρι | #F5DEB3 | |
Μπεζ | #F5F5DC | |
Λευκός καπνός | #F5F5F5 | |
MintCream | #F5FFFA | |
GhostWhite | #F8F8FF | |
Σολομός | #FA8072 | |
AntiqueWhite | #FAEBD7 | |
ΛΕΥΚΑ ΕΙΔΗ | #FAF0E6 | |
Ανοιχτό ΧρυσόΚίτρινο | #FAFAD2 | |
Old Lace | #FDF5E6 | |
το κόκκινο | #FF0000 | |
Φουξία | #FF00FF | |
Πορφύρα βαφή | #FF00FF | |
Βαθύ ροζ | #FF1493 | |
Πορτοκαλοκόκκινο | #FF4500 | |
Ντομάτα | #FF6347 | |
Καυτό ροζ | #FF69B4 | |
Κοράλλι | #FF7F50 | |
Σκούρο πορτοκαλί | #FF8C00 | |
LightSalmon | #FFA07A | |
Πορτοκάλι | #FFA500 | |
Ανοιχτό ροζ | #FFB6C1 | |
Ροζ | #FFC0CB | |
Χρυσός | #FFD700 | |
PeachPuff | #FFDAB9 | |
ΝαβάχοΛευκό | #FFDEAD | |
Είδος φιδιού | #FFE4B5 | |
Είδος πυκνής σούπας | #FFE4C4 | |
MistyRose | #FFE4E1 | |
Αμύγδαλο ασπρισμένο | #FFECD | |
Παπάγια Μαστίγιο | #FFFD5 | |
Λεβάντα Ρουζ | #FFF0F5 | |
SeaShell | #FFF5EE | |
Μετάξι καλαμποκιού | #FFF8DC | |
LemonChiffon | #FFFACD | |
FloralWhite | #FFFAF0 | |
Χιόνι | #FFFAFA | |
Κίτρινος | #FFFF00 | |
Ανοιχτό κίτρινο | #FFFFE0 | |
Ελεφαντόδοντο | #FFFFFF0 | |
άσπρο | #FFFFFF |
Τα χρώματα HTML υποδεικνύονται με έξι χαρακτήρες μετά τον κάθετο χαρακτήρα - για παράδειγμα, #000000. Αυτά τα έξι σύμβολα αντιπροσωπεύουν τις αναλογίες των διαφορετικών χρωμάτων (Κόκκινο, Πράσινο, Μπλε) στο τελικό χρώμα. Στην οθόνη του υπολογιστή σας, η εικόνα σχηματίζεται από έναν τεράστιο αριθμό κουκκίδων που ονομάζονται pixel. Κάθε pixel είναι μια μικρή πηγή φωτός, ας το ονομάσουμε «φακό», που με τη σειρά του αποτελείται από τρεις φακούς - κόκκινο, πράσινο και μπλε. Μειώνοντας ή αυξάνοντας την ένταση της λάμψης μεμονωμένων έγχρωμων φακών, παίρνουμε το επιθυμητό χρώμα.
Κώδικες χρωμάτων HTML
Τα χρώματα σε HTML αντιπροσωπεύονται από μια δεκαεξαδική (HEX) σημειογραφία κόκκινου, μπλε και πράσινου (RGB).
Η μικρότερη τιμή χρώματος είναι 0 (δεκαεξαδικό 00). Η υψηλότερη τιμή χρώματος είναι 255 (hex FF).
Η δεκαεξαδική τιμή χρώματος είναι τρία ψηφία που ξεκινούν με το σύμβολο #.
Χρωματικοί κωδικοί (σημασίες)
Χρώμα | Κωδικός HEX | Κωδικός RGB |
---|---|---|
#000000 | rgb(0,0,0) | |
#FF0000 | rgb(255,0,0) | |
#00FF00 | rgb(0,255,0) | |
#0000FF | rgb(0,0,255) | |
#FFFF00 | rgb(255,255,0) | |
#00FFFF | rgb(0,255,255) | |
#FF00FF | rgb(255,0,255) | |
#C0C0C0 | rgb(192,192,192) | |
#FFFFFF | rgb(255,255,255) |
16 εκατομμύρια αποχρώσεις
Ο συνδυασμός κόκκινου, μπλε και πράσινου με τιμές που κυμαίνονται από 0 έως 255 για το ποσοστό κάθε χρώματος έχει ως αποτέλεσμα συνολικά πάνω από 16 εκατομμύρια αποχρώσεις (256 x 256 x 256).
Οι περισσότερες σύγχρονες οθόνες είναι ικανές να εμφανίζουν τουλάχιστον 16.384 διαφορετικές αποχρώσεις (οι οθόνες LCD είναι γενικά ικανές να εμφανίζουν 262 χιλιάδες 16 εκατομμύρια (ενημερώθηκε Οκτώβριος 2013)χρώματα και οι οθόνες CRT μπορούν να εμφανίσουν σχεδόν απεριόριστο αριθμό χρωμάτων).
Ο πίνακας χρωμάτων παρακάτω δείχνει την αλλαγή στην αναλογία του κόκκινου από 0 σε 255 με μηδενικές τιμές για το μπλε και το πράσινο:
το κόκκινο | Κωδικός HEX | Κωδικός RGB |
---|---|---|
#000000 | rgb(0,0,0) | |
#080000 | rgb(8,0,0) | |
#100000 | rgb(16,0,0) | |
#180000 | rgb(24,0,0) | |
#200000 | rgb(32,0,0) | |
#280000 | rgb(40,0,0) | |
#300000 | rgb(48,0,0) | |
#380000 | rgb(56,0,0) | |
#400000 | rgb(64,0,0) | |
#480000 | rgb(72,0,0) | |
#500000 | rgb(80,0,0) | |
#580000 | rgb(88,0,0) | |
#600000 | rgb(96,0,0) | |
#680000 | rgb(104,0,0) | |
#700000 | rgb(112,0,0) | |
#780000 | rgb(120,0,0) | |
#800000 | rgb(128,0,0) | |
#880000 | rgb(136,0,0) | |
#900000 | rgb(144,0,0) | |
#980000 | rgb(152,0,0) | |
#A00000 | rgb(160,0,0) | |
#A80000 | rgb(168,0,0) | |
#B00000 | rgb(176,0,0) | |
#B80000 | rgb(184,0,0) | |
#C00000 | rgb(192,0,0) | |
#C80000 | rgb(200,0,0) | |
#D00000 | rgb(208,0,0) | |
#D80000 | rgb(216,0,0) | |
#E00000 | rgb(224,0,0) | |
#E80000 | rgb(232,0,0) | |
#F00000 | rgb(240,0,0) | |
#F80000 | rgb(248,0,0) | |
#FF0000 | rgb(255,0,0) |
Αποχρώσεις του γκρι
Για να αποκτήσετε αποχρώσεις του γκρι, χρησιμοποιούνται ίσα μερίδια όλων των χρωμάτων. Για να σας διευκολύνουμε να επιλέξετε το σωστό χρώμα, σας παρέχουμε κωδικούς γκρι αποχρώσεων
Αποχρώσεις του γκρι | Κωδικός HEX | Κωδικός RGB |
---|---|---|
#000000 | rgb(0,0,0) | |
#080808 | rgb(8,8,8) | |
#101010 | rgb(16,16,16) | |
#181818 | rgb(24,24,24) | |
#202020 | rgb(32,32,32) | |
#282828 | rgb(40,40,40) | |
#303030 | rgb(48,48,48) | |
#383838 | rgb(56,56,56) | |
#404040 | rgb(64,64,64) | |
#484848 | rgb(72,72,72) | |
#505050 | rgb(80,80,80) | |
#585858 | rgb(88,88,88) | |
#606060 | rgb(96,96,96) | |
#686868 | rgb(104,104,104) | |
#707070 | rgb(112,112,112) | |
#787878 | rgb(120,120,120) | |
#808080 | rgb(128,128,128) | |
#888888 | rgb(136,136,136) | |
#909090 | rgb(144,144,144) | |
#989898 | rgb(152,152,152) | |
#A0A0A0 | rgb(160,160,160) | |
#A8A8A8 | rgb(168,168,168) | |
#B0B0B0 | rgb(176,176,176) | |
#B8B8B8 | rgb(184,184,184) | |
#C0C0C0 | rgb(192,192,192) | |
#C8C8C8 | rgb(200.200.200) | |
#D0D0D0 | rgb(208,208,208) | |
#D8D8D8 | rgb(216,216,216) | |
#E0E0E0 | rgb(224,224,224) | |
#E8E8E8 | rgb(232,232,232) | |
#F0F0F0 | rgb(240,240,240) | |
#F8F8F8 | rgb(248,248,248) | |
#FFFFFF | rgb(255,255,255) |
Ονόματα χρωμάτων html μεταξύ προγραμμάτων περιήγησης (όλα τα προγράμματα περιήγησης).
Μια συλλογή από 150 ονόματα χρωμάτων σε html, που υποστηρίζεται σε όλα τα προγράμματα περιήγησης.
Τυποποιημένα ονόματα χρωμάτων
Το W3C απαριθμεί 16 έγκυρα ονόματα χρωμάτων για HTML και CSS: aqua, μαύρο, μπλε, φούξια, γκρι, πράσινο, λάιμ, καφέ (καστανιά), navy (ultramarine), λαδί (ελιά), μωβ (μωβ), κόκκινο (κόκκινο) , ασημί (ασημί), γαλαζοπράσινο (γκρι), λευκό (λευκό) και κίτρινο (κίτρινο).
Όταν χρησιμοποιείτε χρώματα που δεν περιλαμβάνονται σε αυτήν τη λίστα, είναι πιο σωστό να χρησιμοποιείτε τον δεκαεξαδικό (HEX) κωδικό τους ή τον κωδικό RGB.
Ασφαλή χρώματα
Πριν από αρκετά χρόνια, όταν οι υπολογιστές μπορούσαν να υποστηρίξουν το πολύ 256 διαφορετικά χρώματα, προτάθηκε μια λίστα με 216 "Ασφαλή χρώματα στο Διαδίκτυο", με 40 χρώματα δεσμευμένα για το σύστημα.
Αυτή η παλέτα 216 χρωμάτων δημιουργήθηκε για να εμφανίζει σωστά τα χρώματα στη λειτουργία παλέτας 256 χρωμάτων.
Τώρα αυτό δεν έχει σημασία γιατί οι περισσότεροι υπολογιστές σε όλο τον κόσμο υποστηρίζουν εκατομμύρια αποχρώσεις χρώματος. Σε κάθε περίπτωση, εδώ είναι μια λίστα με αυτά τα χρώματα:
000000 | 000033 | 000066 | 000099 | 0000 CC | 0000 FF |
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 | 3300 CC | 3300 FF |
333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF |
336600 | 336633 | 336666 | 336699 | 3366 CC | 3366FF |
339900 | 339933 | 339966 | 339999 | 3399 CC | 3399FF |
33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF |
33 FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33ΦΦΦΦ |
660000 | 660033 | 660066 | 660099 | 6600 CC | 6600 FF |
663300 | 663333 | 663366 | 663399 | 6633 CC | 6633FF |
666600 | 666633 | 666666 | 666699 | 6666 CC | 6666FF |
669900 | 669933 | 669966 | 669999 | 6699 CC | 6699FF |
66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF |
66 FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF |
990000 | 990033 | 990066 | 990099 | 9900 CC | 9900 FF |
993300 | 993333 | 993366 | 993399 | 9933 CC | 9933FF |
996600 | 996633 | 996666 | 996699 | 9966 CC | 9966FF |
999900 | 999933 | 999966 | 999999 | 9999 CC | 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 | ΦΦΦΦΦΦ |
Για σελίδες html, τα χρώματα υποδεικνύονται κυρίως στο δεκαεξαδικό σύστημα. Για να γίνει αυτό, χρησιμοποιούνται δύο τύποι εγγραφής κώδικα - πλήρης ή συντομευμένη. Για να υποδείξετε σωστά το χρώμα html πλήρως, πρέπει να γράψετε έξι χαρακτήρες (αριθμούς ή/και αγγλικά γράμματα) μετά το σημάδι κατακερματισμού, για παράδειγμα, το μαύρο γράφεται ως εξής: #000000. Η συντομογραφία για τον καθορισμό των χρωμάτων html αποτελείται από έναν κατακερματισμό και τρεις αριθμούς ή/και γράμματα πίσω από αυτό. Ωστόσο, αυτός ο τύπος αποθέματος μπορεί να χρησιμοποιηθεί μόνο εάν η πλήρης εγγραφή ενός δεδομένου χρώματος αποτελείται από πανομοιότυπα σύμβολα μετά το σήμα κατακερματισμού. Για παράδειγμα, το ίδιο μαύρο χρώμα μπορεί να γραφτεί ως εξής: #000. Μπορείτε να καθορίσετε χρώματα html χρησιμοποιώντας τόσο μεγάλους όσο και μικρούς χαρακτήρες, καθώς δεν κάνουν διάκριση πεζών-κεφαλαίων.
Κάθε χαρακτήρας που γράφεται μετά το "#" αντιστοιχεί σε μια ορισμένη αναλογία των χρωμάτων κόκκινο, πράσινο και μπλε. Με τη σειρά τους, όλες οι οθόνες αποτελούνται από έναν τεράστιο αριθμό pixel (μικροσκοπικές κουκκίδες), καθένα από τα οποία περιλαμβάνει 3 λεγόμενους «φακός» (πηγές φωτός): κόκκινο, πράσινο και μπλε. Στη συνέχεια, ρυθμίζοντας την ένταση του φωτός που εκπέμπεται από αυτούς τους «φακός», η οθόνη εμφανίζει το χρώμα που χρειαζόμαστε.
Συνδυάζοντας την ένταση εκπομπής κόκκινου, μπλε και πράσινου φωτός (από 0 έως 256), οι οθόνες μπορούν να εμφανίσουν 16.000.000 διαφορετικές αποχρώσεις.
Επίσης, τα χρώματα για ιστότοπους μπορούν να υποδεικνύονται προφορικά ή σε κώδικα RGB.
Σήμερα, 147 χρώματα μπορούν να γραφτούν προφορικά. Είναι σημαντικό να γνωρίζετε ότι ορισμένα διαφορετικά ονόματα μπορεί να σημαίνουν τα ίδια χρώματα, για παράδειγμα το γκρι και το γκρι είναι το γκρι χρώμα (#808080).
Ασφαλή χρώματα για ιστοσελίδες.
Δεν μπορεί κάθε οθόνη και πρόγραμμα περιήγησης να εμφανίσει σωστά και τα 16 εκατομμύρια χρώματα html.
Εάν, για παράδειγμα, συναντήσετε ένα χρώμα που το πρόγραμμα περιήγησης δεν μπορεί να εμφανίσει σωστά, τότε:
- Το πρόγραμμα περιήγησης το αντικαθιστά με αυτό που μοιάζει περισσότερο με αυτό και μπορεί να αναπαραχθεί με επιτυχία.
- Για να εμφανιστεί σωστά, το πρόγραμμα περιήγησης μπορεί να αναμίξει πολλά χρώματα και να αναπαράγει το αποτέλεσμα.
Για να διασφαλίσετε ότι η έξοδος σε οποιοδήποτε πρόγραμμα περιήγησης και σε οποιαδήποτε οθόνη είναι το χρώμα που καθορίσατε στον κώδικα, συνιστάται η χρήση "Ασφαλών Χρωμάτων". Καθορίστηκαν όχι χειροκίνητα ή από επιθυμία κάποιου άλλου, αλλά μαθηματικά. Υπάρχουν 216 τέτοια 100% ασφαλή χρώματα για έγγραφα HTML. Και παρόλο που οι σημερινές τεχνολογίες έχουν φτάσει στο σημείο όπου οι σύγχρονες οθόνες και τα προγράμματα περιήγησης αναγνωρίζουν εκατομμύρια αποχρώσεις, συνιστούμε να χρησιμοποιήσετε αυτά τα ασφαλή χρώματα για να εγγυηθείτε την απόδοση χρωμάτων.
Δεκαεξαδικό σύστημα χρωμάτων. | Χρωματικοί κωδικοί σε RGB (Κόκκινο, Πράσινο, Μπλε). |
Κωδικός χρώματος HTML: #000000 | Χρώμα RGB: 0 0 0 |
Κωδικός χρώματος HTML: #333333 | Χρώμα RGB: 51 51 51 |
Κωδικός χρώματος HTML: #666666 | Χρώμα RGB: 102 102 102 |
Κωδικός χρώματος HTML: #999999 | Χρώμα RGB: 153 153 153 |
Κωδικός χρώματος HTML: #CCCCCC | Χρώμα RGB: 204 204 204 |
Κωδικός χρώματος HTML: #FFFFFF | Χρώμα RGB: 255 255 255 |
Κωδικός χρώματος HTML: #666600 | Χρώμα RGB: 102 102 0 |
Κωδικός χρώματος HTML: #999900 | Χρώμα RGB: 153 153 0 |
Κωδικός χρώματος HTML: #999933 | Χρώμα RGB: 153 153 51 |
Κωδικός χρώματος HTML: #999966 | Χρώμα RGB: 153 153 102 |
Κωδικός χρώματος HTML: #CCCC33 | Χρώμα RGB: 204 204 51 |
Κωδικός χρώματος HTML: #CCCC66 | Χρώμα RGB: 204 204 102 |
Κωδικός χρώματος HTML: #333300 | Χρώμα RGB: 51 51 0 |
Κωδικός χρώματος HTML: #666633 | Χρώμα RGB: 102 102 51 |
Κωδικός χρώματος HTML: #CCCC99 | Χρώμα RGB: 204 204 153 |
Κωδικός χρώματος HTML: #CCFF33 | Χρώμα RGB: 204 255 51 |
Κωδικός χρώματος HTML: #CCFF00 | Χρώμα RGB: 204 255 0 |
Κωδικός χρώματος HTML: #CCFF66 | Χρώμα RGB: 204 255 102 |
Κωδικός χρώματος HTML: #669900 | Χρώμα RGB: 102 153 0 |
Κωδικός χρώματος HTML: #99CC33 | Χρώμα RGB: 153 204 51 |
Κωδικός χρώματος HTML: #99CC00 | Χρώμα RGB: 153 204 0 |
Κωδικός χρώματος HTML: #99CC66 | Χρώμα RGB: 153 204 102 |
Κωδικός χρώματος HTML: #99FF33 | Χρώμα RGB: 153 255 51 |
Κωδικός χρώματος HTML: #99FF00 | Χρώμα RGB: 153 255 0 |
Κωδικός χρώματος HTML: #336600 | Χρώμα RGB: 51 102 0 |
Κωδικός χρώματος HTML: #669933 | Χρώμα RGB: 102 153 51 |
Κωδικός χρώματος HTML: #66CC33 | Χρώμα RGB: 102 204 51 |
Κωδικός χρώματος HTML: #66CC00 | Χρώμα RGB: 102 204 0 |
Κωδικός χρώματος HTML: #99FF66 | Χρώμα RGB: 153 255 102 |
Κωδικός χρώματος HTML: #CCFF99 | Χρώμα RGB: 204 255 153 |
Κωδικός χρώματος HTML: #009900 | Χρώμα RGB: 0 153 0 |
Κωδικός χρώματος HTML: #339900 | Χρώμα RGB: 51 153 0 |
Κωδικός χρώματος HTML: #33CC00 | Χρώμα RGB: 51 204 0 |
Κωδικός χρώματος HTML: #33FF00 | Χρώμα RGB: 51 255 0 |
Κωδικός χρώματος HTML: #66FF33 | Χρώμα RGB: 102 255 51 |
Κωδικός χρώματος HTML: #66FF00 | Χρώμα RGB: 102 255 0 |
Κωδικός χρώματος HTML: #00CC33 | Χρώμα RGB: 0 204 51 |
Κωδικός χρώματος HTML: #33CC33 | Χρώμα RGB: 51 204 51 |
Κωδικός χρώματος HTML: #00CC00 | Χρώμα RGB: 0 204 0 |
Κωδικός χρώματος HTML: #00FF00 | Χρώμα RGB: 0 255 0 |
Κωδικός χρώματος HTML: #00FF33 | Χρώμα RGB: 0 255 51 |
Κωδικός χρώματος HTML: #33FF33 | Χρώμα RGB: 51 255 51 |
Κωδικός χρώματος HTML: #003300 | Χρώμα RGB: 0 51 0 |
Κωδικός χρώματος HTML: #336633 | Χρώμα RGB: 51 102 51 |
Κωδικός χρώματος HTML: #669966 | Χρώμα RGB: 102 153 102 |
Κωδικός χρώματος HTML: #66CC66 | Χρώμα RGB: 102 204 102 |
Κωδικός χρώματος HTML: #99CC99 | Χρώμα RGB: 153 204 153 |
Κωδικός χρώματος HTML: #CCFFCC | Χρώμα RGB: 204 255 204 |
Κωδικός χρώματος HTML: #006600 | Χρώμα RGB: 0 102 0 |
Κωδικός χρώματος HTML: #339933 | Χρώμα RGB: 51 153 51 |
Κωδικός χρώματος HTML: #00FF66 | Χρώμα RGB: 0 255 102 |
Κωδικός χρώματος HTML: #33FF66 | Χρώμα RGB: 51 255 102 |
Κωδικός χρώματος HTML: #66FF66 | Χρώμα RGB: 102 255 102 |
Κωδικός χρώματος HTML: #99FF99 | Χρώμα RGB: 153 255 153 |
Κωδικός χρώματος HTML: #009933 | Χρώμα RGB: 0 153 51 |
Κωδικός χρώματος HTML: #00CC66 | Χρώμα RGB: 0 204 102 |
Κωδικός χρώματος HTML: #33CC66 | Χρώμα RGB: 51 204 102 |
Κωδικός χρώματος HTML: #00FF99 | Χρώμα RGB: 0 255 153 |
Κωδικός χρώματος HTML: #33FF99 | Χρώμα RGB: 51 255 153 |
Κωδικός χρώματος HTML: #66FF99 | Χρώμα RGB: 102 255 153 |
Κωδικός χρώματος HTML: #006633 | Χρώμα RGB: 0 102 51 |
Κωδικός χρώματος HTML: #009966 | Χρώμα RGB: 0 153 102 |
Κωδικός χρώματος HTML: #339966 | Χρώμα RGB: 51 153 102 |
Κωδικός χρώματος HTML: #00CC99 | Χρώμα RGB: 0 204 153 |
Κωδικός χρώματος HTML: #33CC99 | Χρώμα RGB: 51 204 153 |
Κωδικός χρώματος HTML: #66CC99 | Χρώμα RGB: 102 204 153 |
Κωδικός χρώματος HTML: #009999 | Χρώμα RGB: 0 153 153 |
Κωδικός χρώματος HTML: #33CCCC | Χρώμα RGB: 51 204 204 |
Κωδικός χρώματος HTML: #00FFCC | Χρώμα RGB: 0 255 204 |
Κωδικός χρώματος HTML: #33FFCC | Χρώμα RGB: 51 255 204 |
Κωδικός χρώματος HTML: #66FFCC | Χρώμα RGB: 102 255 204 |
Κωδικός χρώματος HTML: #99FFCC | Χρώμα RGB: 153 255 204 |
Κωδικός χρώματος HTML: #00CCCC | Χρώμα RGB: 0 204 204 |
Κωδικός χρώματος HTML: #00FFFF | Χρώμα RGB: 0 255 255 |
Κωδικός χρώματος HTML: #33FFFF | Χρώμα RGB: 51 255 255 |
Κωδικός χρώματος HTML: #66FFFF | Χρώμα RGB: 102 255 255 |
Κωδικός χρώματος HTML: #99FFFF | Χρώμα RGB: 153 255 255 |
Κωδικός χρώματος HTML: #CCFFFF | Χρώμα RGB: 204 255 255 |
Κωδικός χρώματος HTML: #336666 | Χρώμα RGB: 51 102 102 |
Κωδικός χρώματος HTML: #006666 | Χρώμα RGB: 0 102 102 |
Κωδικός χρώματος HTML: #669999 | Χρώμα RGB: 102 153 153 |
Κωδικός χρώματος HTML: #339999 | Χρώμα RGB: 51 153 153 |
Κωδικός χρώματος HTML: #66CCCC | Χρώμα RGB: 102 204 204 |
Κωδικός χρώματος HTML: #99CCCC | Χρώμα RGB: 153 204 204 |
Κωδικός χρώματος HTML: #003333 | Χρώμα RGB: 0 51 51 |
Κωδικός χρώματος HTML: #0099CC | Χρώμα RGB: 0 153 204 |
Κωδικός χρώματος HTML: #3399CC | Χρώμα RGB: 51 153 204 |
Κωδικός χρώματος HTML: #00CCFF | Χρώμα RGB: 0 204 255 |
Κωδικός χρώματος HTML: #33CCFF | Χρώμα RGB: 51 204 255 |
Κωδικός χρώματος HTML: #66CCFF | Χρώμα RGB: 102 204 255 |
Κωδικός χρώματος HTML: #006699 | Χρώμα RGB: 0 102 153 |
Κωδικός χρώματος HTML: #336699 | Χρώμα RGB: 51 102 153 |
Κωδικός χρώματος HTML: #6699CC | Χρώμα RGB: 102 153 204 |
Κωδικός χρώματος HTML: #0099FF | Χρώμα RGB: 0 153 255 |
Κωδικός χρώματος HTML: #3399FF | Χρώμα RGB: 51 153 255 |
Κωδικός χρώματος HTML: #99CCFF | Χρώμα RGB: 153 204 255 |
Κωδικός χρώματος HTML: #003366 | Χρώμα RGB: 0 51 102 |
Κωδικός χρώματος HTML: #003399 | Χρώμα RGB: 0 51 153 |
Κωδικός χρώματος HTML: #0033FF | Χρώμα RGB: 0 51 255 |
Κωδικός χρώματος HTML: #3366CC | Χρώμα RGB: 51 102 204 |
Κωδικός χρώματος HTML: #0066CC | Χρώμα RGB: 0 102 204 |
Κωδικός χρώματος HTML: #0066FF | Χρώμα RGB: 0 102 255 |
Κωδικός χρώματος HTML: #000033 | Χρώμα RGB: 0 0 51 |
Κωδικός χρώματος HTML: #0033CC | Χρώμα RGB: 0 51 204 |
Κωδικός χρώματος HTML: #0000CC | Χρώμα RGB: 0 0 204 |
Κωδικός χρώματος HTML: #0000FF | Χρώμα RGB: 0 0 255 |
Κωδικός χρώματος HTML: #3366FF | Χρώμα RGB: 51 102 255 |
Κωδικός χρώματος HTML: #6699FF | Χρώμα RGB: 102 153 255 |
Κωδικός χρώματος HTML: #000066 | Χρώμα RGB: 0 0 102 |
Κωδικός χρώματος HTML: #000099 | Χρώμα RGB: 0 0 153 |
Κωδικός χρώματος HTML: #3333CC | Χρώμα RGB: 51 51 204 |
Κωδικός χρώματος HTML: #3300CC | Χρώμα RGB: 51 0 204 |
Κωδικός χρώματος HTML: #3300FF | Χρώμα RGB: 51 0 255 |
Κωδικός χρώματος HTML: #3333FF | Χρώμα RGB: 51 51 255 |
Κωδικός χρώματος HTML: #333366 | Χρώμα RGB: 51 51 102 |
Κωδικός χρώματος HTML: #333399 | Χρώμα RGB: 51 51 153 |
Κωδικός χρώματος HTML: #666699 | Χρώμα RGB: 102 102 153 |
Κωδικός χρώματος HTML: #6666CC | Χρώμα RGB: 102 102 204 |
Κωδικός χρώματος HTML: #6666FF | Χρώμα RGB: 102 102 255 |
Κωδικός χρώματος HTML: #9999CC | Χρώμα RGB: 153 153 204 |
Κωδικός χρώματος HTML: #330066 | Χρώμα RGB: 51 0 102 |
Κωδικός χρώματος HTML: #330099 | Χρώμα RGB: 51 0 153 |
Κωδικός χρώματος HTML: #6600FF | Χρώμα RGB: 102 0 255 |
Κωδικός χρώματος HTML: #6633FF | Χρώμα RGB: 102 51 255 |
Κωδικός χρώματος HTML: #9999FF | Χρώμα RGB: 153 153 255 |
Κωδικός χρώματος HTML: #CCCCFF | Χρώμα RGB: 204 204 255 |
Κωδικός χρώματος HTML: #330033 | Χρώμα RGB: 51 0 51 |
Κωδικός χρώματος HTML: #663399 | Χρώμα RGB: 102 51 153 |
Κωδικός χρώματος HTML: #6633CC | Χρώμα RGB: 102 51 204 |
Κωδικός χρώματος HTML: #6600CC | Χρώμα RGB: 102 0 204 |
Κωδικός χρώματος HTML: #9966FF | Χρώμα RGB: 153 102 255 |
Κωδικός χρώματος HTML: #9966CC | Χρώμα RGB: 153 102 204 |
Κωδικός χρώματος HTML: #663366 | Χρώμα RGB: 102 51 102 |
Κωδικός χρώματος HTML: #660099 | Χρώμα RGB: 102 0 153 |
Κωδικός χρώματος HTML: #9900FF | Χρώμα RGB: 153 0 255 |
Κωδικός χρώματος HTML: #9933FF | Χρώμα RGB: 153 51 255 |
Κωδικός χρώματος HTML: #9933CC | Χρώμα RGB: 153 51 204 |
Κωδικός χρώματος HTML: #CC99FF | Χρώμα RGB: 204 153 255 |
Κωδικός χρώματος HTML: #660066 | Χρώμα RGB: 102 0 102 |
Κωδικός χρώματος HTML: #996699 | Χρώμα RGB: 153 102 153 |
Κωδικός χρώματος HTML: #9900CC | Χρώμα RGB: 153 0 204 |
Κωδικός χρώματος HTML: #CC00FF | Χρώμα RGB: 204 0 255 |
Κωδικός χρώματος HTML: #CC33FF | Χρώμα RGB: 204 51 255 |
Κωδικός χρώματος HTML: #CC66FF | Χρώμα RGB: 204 102 255 |
Κωδικός χρώματος HTML: #993399 | Χρώμα RGB: 153 51 153 |
Κωδικός χρώματος HTML: #990099 | Χρώμα RGB: 153 0 153 |
Κωδικός χρώματος HTML: #CC33CC | Χρώμα RGB: 204 51 204 |
Κωδικός χρώματος HTML: #CC00CC | Χρώμα RGB: 204 0 204 |
Κωδικός χρώματος HTML: #CC66CC | Χρώμα RGB: 204 102 204 |
Κωδικός χρώματος HTML: #CC99CC | Χρώμα RGB: 204 153 204 |
Κωδικός χρώματος HTML: #CC3399 | Χρώμα RGB: 204 51 153 |
Κωδικός χρώματος HTML: #FF00FF | Χρώμα RGB: 255 0 255 |
Κωδικός χρώματος HTML: #FF33FF | Χρώμα RGB: 255 51 255 |
Κωδικός χρώματος HTML: #FF66FF | Χρώμα RGB: 255 102 255 |
Κωδικός χρώματος HTML: #FF99FF | Χρώμα RGB: 255 153 255 |
Κωδικός χρώματος HTML: #FFCCFF | Χρώμα RGB: 255 204 255 |
Κωδικός χρώματος HTML: #990066 | Χρώμα RGB: 153 0 102 |
Κωδικός χρώματος HTML: #CC0099 | Χρώμα RGB: 204 0 153 |
Κωδικός χρώματος HTML: #CC6699 | Χρώμα RGB: 204 102 153 |
Κωδικός χρώματος HTML: #FF33CC | Χρώμα RGB: 255 51 204 |
Κωδικός χρώματος HTML: #FF00CC | Χρώμα RGB: 255 0 204 |
Κωδικός χρώματος HTML: #FF66CC | Χρώμα RGB: 255 102 204 |
Κωδικός χρώματος HTML: #660033 | Χρώμα RGB: 102 0 51 |
Κωδικός χρώματος HTML: #993366 | Χρώμα RGB: 153 51 102 |
Κωδικός χρώματος HTML: #CC0066 | Χρώμα RGB: 204 0 102 |
Κωδικός χρώματος HTML: #FF0099 | Χρώμα RGB: 255 0 153 |
Κωδικός χρώματος HTML: #FF3399 | Χρώμα RGB: 255 51 153 |
Κωδικός χρώματος HTML: #FF99CC | Χρώμα RGB: 255 153 204 |
Κωδικός χρώματος HTML: #663333 | Χρώμα RGB: 102 51 51 |
Κωδικός χρώματος HTML: #996666 | Χρώμα RGB: 153 102 102 |
Κωδικός χρώματος HTML: #CC3366 | Χρώμα RGB: 204 51 102 |
Κωδικός χρώματος HTML: #FF0066 | Χρώμα RGB: 255 0 102 |
Κωδικός χρώματος HTML: #FF3366 | Χρώμα RGB: 255 51 102 |
Κωδικός χρώματος HTML: #FF6699 | Χρώμα RGB: 255 102 153 |
Κωδικός χρώματος HTML: #330000 | Χρώμα RGB: 51 0 0 |
Κωδικός χρώματος HTML: #990033 | Χρώμα RGB: 153 0 51 |
Κωδικός χρώματος HTML: #993333 | Χρώμα RGB: 153 51 51 |
Κωδικός χρώματος HTML: #CC3333 | Χρώμα RGB: 204 51 51 |
Κωδικός χρώματος HTML: #CC6666 | Χρώμα RGB: 204 102 102 |
Κωδικός χρώματος HTML: #CC9999 | Χρώμα RGB: 204 153 153 |
Κωδικός χρώματος HTML: #CC0033 | Χρώμα RGB: 204 0 51 |
Κωδικός χρώματος HTML: #FF0033 | Χρώμα RGB: 255 0 51 |
Κωδικός χρώματος HTML: #FF3333 | Χρώμα RGB: 255 51 51 |
Κωδικός χρώματος HTML: #FF6666 | Χρώμα RGB: 255 102 102 |
Κωδικός χρώματος HTML: #FF9999 | Χρώμα RGB: 255 153 153 |
Κωδικός χρώματος HTML: #FFCCCC | Χρώμα RGB: 255 204 204 |
Κωδικός χρώματος HTML: #990000 | Χρώμα RGB: 153 0 0 |
Κωδικός χρώματος HTML:#CC0000 | Χρώμα RGB: 204 0 0 |
Κωδικός χρώματος HTML: #FF0000 | Χρώμα RGB: 255 0 0 |
Κωδικός χρώματος HTML: #FF3300 | Χρώμα RGB: 255 51 0 |
Κωδικός χρώματος HTML: #CC3300 | Χρώμα RGB: 204 51 0 |
Κωδικός χρώματος HTML: #FF6633 | Χρώμα RGB: 255 102 51 |
Κωδικός χρώματος HTML: #660000 | Χρώμα RGB: 102 0 0 |
Κωδικός χρώματος HTML: #993300 | Χρώμα RGB: 153 51 0 |
Κωδικός χρώματος HTML: #CC6633 | Χρώμα RGB: 204 102 51 |
Κωδικός χρώματος HTML: #FF6600 | Χρώμα RGB: 255 102 0 |
Κωδικός χρώματος HTML: #FF9966 | Χρώμα RGB: 255 153 102 |
Κωδικός χρώματος HTML: #FFCC99 | Χρώμα RGB: 255 204 153 |
Κωδικός χρώματος HTML: #663300 | Χρώμα RGB: 102 51 0 |
Κωδικός χρώματος HTML: #996633 | Χρώμα RGB: 153 102 51 |
Κωδικός χρώματος HTML: #CC6600 | Χρώμα RGB: 204 102 0 |
Κωδικός χρώματος HTML: #CC9966 | Χρώμα RGB: 204 153 102 |
Κωδικός χρώματος HTML: #FF9933 | Χρώμα RGB: 255 153 51 |
Κωδικός χρώματος HTML: #FF9900 | Χρώμα RGB: 255 153 0 |
Κωδικός χρώματος HTML: #996600 | Χρώμα RGB: 153 102 0 |
Κωδικός χρώματος HTML: #CC9933 | Χρώμα RGB: 204 153 51 |
Κωδικός χρώματος HTML: #CC9900 | Χρώμα RGB: 204 153 0 |
Κωδικός χρώματος HTML: #FFCC33 | Χρώμα RGB: 255 204 51 |
Κωδικός χρώματος HTML: #FFCC00 | Χρώμα RGB: 255 204 0 |
Κωδικός χρώματος HTML: #FFCC66 | Χρώμα RGB: 255 204 102 |
Κωδικός χρώματος HTML: #CCCC00 | Χρώμα RGB: 204 204 0 |
Κωδικός χρώματος HTML: #FFFF00 | Χρώμα RGB: 255 255 0 |
Κωδικός χρώματος HTML: #FFFF33 | Χρώμα RGB: 255 255 51 |
Κωδικός χρώματος HTML: #FFFF66 | Χρώμα RGB: 255 255 102 |
Κωδικός χρώματος HTML: #FFFF99 | Χρώμα RGB: 255 255 153 |
Κωδικός χρώματος HTML: #FFFFCC | Χρώμα RGB: 255 255 204 |
Αυτός ο πίνακας περιλαμβάνει 216 ασφαλείς κωδικούς χρωμάτων html. Κάθε χρώμα έχει μια τιμή σε RGB για τον καθορισμό χρώματος σε προγράμματα επεξεργασίας γραφικών και HEX για τον καθορισμό χρώματος σε σελίδες html.
Οι δεκαεξαδικοί αριθμοί χρησιμοποιούνται για τον καθορισμό των χρωμάτων. Το δεκαεξαδικό σύστημα, σε αντίθεση με το δεκαδικό σύστημα, βασίζεται, όπως υποδηλώνει το όνομά του, στον αριθμό 16. Οι αριθμοί θα είναι οι εξής: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Οι αριθμοί από το 10 έως το 15 αντικαθίστανται από λατινικά γράμματα. Οι αριθμοί μεγαλύτεροι από το 15 στο δεκαεξαδικό σύστημα σχηματίζονται με το συνδυασμό δύο αριθμών σε έναν. Για παράδειγμα, ο αριθμός 255 σε δεκαδικό αριθμό αντιστοιχεί στον αριθμό FF σε δεκαεξαδικό. Για να αποφευχθεί η σύγχυση στον προσδιορισμό του συστήματος αριθμών, ένα σύμβολο κατακερματισμού # τοποθετείται πριν από τον δεκαεξαδικό αριθμό, για παράδειγμα #666999. Κάθε ένα από τα τρία χρώματα - κόκκινο, πράσινο και μπλε - μπορεί να πάρει τιμές από 00 έως FF. Έτσι, το σύμβολο χρώματος χωρίζεται σε τρία στοιχεία #rrggbb, όπου τα δύο πρώτα σύμβολα υποδεικνύουν το κόκκινο συστατικό του χρώματος, τα μεσαία δύο - πράσινο και τα δύο τελευταία - μπλε. Επιτρέπεται η χρήση της συντομευμένης μορφής #rgb, όπου κάθε χαρακτήρας πρέπει να διπλασιαστεί. Έτσι, η καταχώριση #fe0 θα πρέπει να θεωρείται ως #ffee00.
Από όνομα
Internet Explorer | Χρώμιο | ΛΥΡΙΚΗ ΣΚΗΝΗ | Σαφάρι | Firefox | Android | iOS |
4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Τα προγράμματα περιήγησης υποστηρίζουν ορισμένα χρώματα με το όνομά τους. Στον πίνακα 1 δείχνει τα ονόματα, τον δεκαεξαδικό κωδικό, τις τιμές RGB, HSL και την περιγραφή.
Ονομα | Χρώμα | Κώδικας | RGB | HSL | Περιγραφή |
---|---|---|---|---|---|
άσπρο | #ffffff ή #fff | rgb(255,255,255) | hsl(0,0%,100%) | άσπρο | |
ασήμι | #c0c0c0 | rgb(192,192,192) | hsl(0,0%,75%) | Γκρί | |
γκρί | #808080 | rgb(128,128,128) | hsl(0,0%,50%) | Σκούρο γκρι | |
μαύρος | #000000 ή #000 | rgb(0,0,0) | hsl(0,0%,0%) | Μαύρος | |
μαρόν | #800000 | rgb(128,0,0) | hsl(0,100%,25%) | Σκούρο κόκκινο | |
το κόκκινο | #ff0000 ή #f00 | rgb(255,0,0) | hsl(0,100%,50%) | το κόκκινο | |
πορτοκάλι | #ffa500 | rgb(255,165,0) | hsl(38,8,100%,50%) | Πορτοκάλι | |
κίτρινος | #ffff00 ή #ff0 | rgb(255,255,0) | hsl(60,100%,50%) | Κίτρινος | |
ελιά | #808000 | rgb(128,128,0) | hsl(60,100%,25%) | Ελιά | |
άσβεστος | #00ff00 ή #0f0 | rgb(0,255,0) | hsl(120,100%,50%) | Ανοιχτό πράσινο | |
πράσινος | #008000 | rgb(0,128,0) | hsl(120,100%,25%) | Πράσινος | |
aqua | #00ffff ή #0ff | rgb(0,255,255) | hsl(180,100%,50%) | Μπλε | |
μπλε | #0000ff ή #00f | rgb(0,0,255) | hsl(240,100%,50%) | Μπλε | |
ΠΟΛΕΜΙΚΟ ΝΑΥΤΙΚΟ | #000080 | rgb(0,0,128) | hsl(240,100%,25%) | Σκούρο μπλε | |
βάσκας | #008080 | rgb(0,128,128) | hsl(180,100%,25%) | Μπλε πράσινο | |
φουξία | #ff00ff ή #f0f | rgb(255,0,255) | hsl(300,100%,50%) | Ροζ | |
μωβ | #800080 | rgb(128,0,128) | hsl(300,100%,25%) | Βιολέτα |
Χρήση RGB
Internet Explorer | Χρώμιο | ΛΥΡΙΚΗ ΣΚΗΝΗ | Σαφάρι | Firefox | Android | iOS |
5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Μπορείτε να ορίσετε το χρώμα χρησιμοποιώντας τις τιμές του κόκκινου, του πράσινου και του μπλε σε δεκαδικούς όρους. Καθένα από τα τρία συστατικά χρώματος παίρνει μια τιμή από 0 έως 255. Επιτρέπεται επίσης ο καθορισμός του χρώματος ως ποσοστό, με το 100% να αντιστοιχεί στον αριθμό 255. Πρώτα, καθορίστε τη λέξη-κλειδί rgb και, στη συνέχεια, καθορίστε τα στοιχεία χρώματος σε παρένθεση , διαχωρισμένα με κόμματα, για παράδειγμα rgb(255 , 128, 128) ή rgb(100%, 50%, 50%).
RGBA
Internet Explorer | Χρώμιο | ΛΥΡΙΚΗ ΣΚΗΝΗ | Σαφάρι | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Η μορφή RGBA είναι παρόμοια στη σύνταξη με το RGB, αλλά περιλαμβάνει ένα κανάλι άλφα που καθορίζει τη διαφάνεια του στοιχείου. Μια τιμή 0 είναι πλήρως διαφανής, το 1 είναι αδιαφανές και μια ενδιάμεση τιμή όπως το 0,5 είναι ημιδιαφανής.
Το RGBA προστέθηκε στο CSS3, επομένως ο κώδικας CSS πρέπει να επικυρωθεί σε αυτήν την έκδοση. Θα πρέπει να σημειωθεί ότι το πρότυπο CSS3 είναι ακόμη υπό ανάπτυξη και ορισμένα χαρακτηριστικά ενδέχεται να αλλάξουν. Για παράδειγμα, ένα χρώμα σε μορφή RGB που προστέθηκε στην ιδιότητα χρώματος φόντου επικυρώνεται, αλλά ένα χρώμα που προστέθηκε στην ιδιότητα φόντου δεν είναι πλέον έγκυρο. Ταυτόχρονα, τα προγράμματα περιήγησης κατανοούν πολύ σωστά το χρώμα και για τις δύο ιδιότητες.
HSL
Internet Explorer | Χρώμιο | ΛΥΡΙΚΗ ΣΚΗΝΗ | Σαφάρι | Firefox | Android | iOS |
9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Το όνομα της μορφής HSL προέρχεται από τον συνδυασμό των πρώτων γραμμάτων Hue (απόχρωση), Saturate (κορεσμός) και Lightness (ελαφρότητα). Η απόχρωση είναι η τιμή χρώματος στον τροχό χρώματος (Εικ. 1) και δίνεται σε μοίρες. Η 0° αντιστοιχεί στο κόκκινο, η 120° στο πράσινο και η 240° στο μπλε. Η τιμή απόχρωσης μπορεί να κυμαίνεται από 0 έως 359.
Ρύζι. 1. Τροχός χρώματος
Ο κορεσμός είναι η ένταση ενός χρώματος και μετριέται ως ποσοστό από 0% έως 100%. Μια τιμή 0% υποδηλώνει ότι δεν υπάρχει χρώμα και μια απόχρωση του γκρι, 100% είναι η μέγιστη τιμή για κορεσμό.
Το Lightness καθορίζει πόσο φωτεινό είναι το χρώμα και καθορίζεται ως ποσοστό από 0% έως 100%. Οι χαμηλές τιμές κάνουν το χρώμα πιο σκούρο και οι υψηλές τιμές κάνουν το χρώμα πιο ανοιχτό· οι ακραίες τιμές 0% και 100% αντιστοιχούν στο ασπρόμαυρο.
HSLA
Internet Explorer | Χρώμιο | ΛΥΡΙΚΗ ΣΚΗΝΗ | Σαφάρι | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Η μορφή HSLA είναι παρόμοια στη σύνταξη με την HSL, αλλά περιλαμβάνει ένα κανάλι άλφα για τον καθορισμό της διαφάνειας του στοιχείου. Μια τιμή 0 είναι πλήρως διαφανής, το 1 είναι αδιαφανές και μια ενδιάμεση τιμή όπως το 0,5 είναι ημιδιαφανής.
Οι τιμές χρώματος RGBA, HSL και HSLA προστίθενται στο CSS3, επομένως ελέγξτε τον κωδικό σας για την εγκυρότητα της έκδοσης όταν χρησιμοποιείτε αυτές τις μορφές.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
Προειδοποίηση
Όλες οι μέθοδοι σύλληψης λιονταριών που αναφέρονται στον ιστότοπο είναι θεωρητικές και βασίζονται σε υπολογιστικές μεθόδους. Οι συγγραφείς δεν εγγυώνται την ασφάλειά σας κατά τη χρήση τους και αποποιούνται οποιαδήποτε ευθύνη για τα αποτελέσματα. Θυμηθείτε, ένα λιοντάρι είναι ένα αρπακτικό και ένα επικίνδυνο ζώο!
Το αποτέλεσμα αυτού του παραδείγματος φαίνεται στο Σχ. 2.
Ρύζι. 2. Χρώματα στην ιστοσελίδα
Υπάρχουν διάφοροι τρόποι για να αναπαραστήσετε το χρώμα στο σχεδιασμό ιστοσελίδων.
Το HEX είναι ένα δεκαεξαδικό σύστημα αναπαράστασης χρωμάτων που βασίζεται στη βάση 16. Για αυτό το σύστημα, τα αραβικά δεκαδικά ψηφία από το 0 έως το 9 και τα λατινικά γράμματα από το A έως το F χρησιμοποιούνται για να συμπληρώσουν τον ψηφιακό αριθμό στο 16. Για το σχεδιασμό ιστοσελίδων, 16 βασικά χρώματα χρησιμοποιούνται, ο λεγόμενος δεκαεξαδικός χρωματικός κώδικας #RRGGBB, όπου κάθε ζεύγος είναι υπεύθυνο για το μερίδιό του στο χρώμα: RR – κόκκινο, GG – πράσινο και BB – μπλε. Κάθε κλάσμα χρώματος κυμαίνεται από 00 έως FF.
Δύο άλλες αναπαραστάσεις του χρώματος στο σχεδιασμό ιστοσελίδων είναι: με τη μορφή RGB(*,*,*), όπου κάθε κλάσμα «*» ενός χρώματος αντιπροσωπεύεται από δεκαδικά ψηφία από το 0 έως το 255 και με ονόματα χρωμάτων στα αγγλικά.
Κατά τη δημιουργία μιας έγχρωμης εικόνας, το κύριο πρόβλημα είναι η σωστή αναπαραγωγή χρωμάτων σε διαφορετικούς τύπους υπολογιστών, οθονών και προγραμμάτων περιήγησης. Εάν το πρόγραμμα περιήγησης δεν μπορεί να εμφανίσει σωστά ένα χρώμα, επιλέγει ένα παρόμοιο ή αναμιγνύει πολλά χρώματα. Και μερικές φορές μπορεί να αντικατασταθεί με κάποιο εντελώς διαφορετικό χρώμα.
Τραπέζι 16 βασικά χρώματα, τα οποία χρησιμοποιούνται σε όλα τα προγράμματα περιήγησης
Ονομα | Χρώμα | Γοητεύω | (RGB) |
Aqua (κύμα θάλασσας) | #00FFFF | (000,255,255) | |
Μαύρος | #000000 | (000,000,000) | |
Μπλε | #0000FF | (000,000,255) | |
Φούξια (ματζέντα) | #FF00FF | (255,000,255) | |
Γκρί | #808080 | (128,128,128) | |
Πράσινος | #008000 | (000,128,000) | |
Lime (ανοιχτό πράσινο) | #00FF00 | (000,255,000) | |
Καφέ (σκούρο μπορντό) | #800000 | (128,000,000) | |
Navy (σκούρο μπλε) | #000080 | (000,000,128) | |
Ελιά | #808000 | (128,128,000) | |
Μωβ | #800080 | (128,000,128) | |
το κόκκινο | #FF0000 | (255,000,000) | |
Ασήμι | #C0C0C0 | (192,192,192) | |
Κιρκίρι (γκρι-πράσινο) | #008080 | (000,128,128) | |
άσπρο | #FFFFFF | (255,255,255) | |
Κίτρινος | #FFFF00 | (255,255,000) |
Τραπέζι μωβτα χρώματα και τις αποχρώσεις του
Ονομα | Χρώμα | Γοητεύω | (RGB) |
Ματζέντα (ματζέντα) | #FFCBDB | (255,203,219) | |
Ματζέντα (ματζέντα) | #FF0099 | (255,000,153) | |
Ματζέντα (ματζέντα) | #F95A61 | (249,090,097) | |
Φούξια (φούξια) | #FF00FF | (255,000,255) | |
Μωβέιν (μωβ ανιλίνη) | #EF0097 | (239,000,151) | |
Ροζ σομόν (πορτοκαλί ροζ) | #FF91A4 | (255,145,164) | |
Cenise (μια απόχρωση του μωβ) | #DE3163 | (153,149,140) | |
Μελιτζάνα μελιτζάνα (μελιτζάνα) | #990066 | (153,000,132) | |
Ρουζ λεβάντας (ροζ-λεβάντα) |  #FFF0F5 | (255,240,245) | |
Λιλά (λιλά) | #C8A2C8 | (200,162,200) | |
Ματζέντα (ματζέντα) | #FF008F | (255,000,143) | |
Ορχιδέα (ορχιδέα) | #DA70D6 | (218,112,214) | |
Κόκκινο-βιολετί (μωβ-κόκκινο) | #C71585 | (199,021,133) | |
Σαγκουίνικος (σαγκουίνος) | #92000A | (146,000,010) | |
Γαϊδουράγκαθο (απόχρωση του μωβ) | #D8BFD8 | (185,211,238) | |
Βιολετί-μελιτζάνα (μια απόχρωση του μωβ) | #991199 | (153,017,153) | |
Rosa vivo (βαθύ ροζ) | #FF007F | (255,000,127) | |
Λεβάντα-τριαντάφυλλο (μια απόχρωση του μωβ) | #FBA0E3 | (108,123,139) | |
Mountbatten ροζ | #997ABD | (153,122,141) |
Τραπέζι γκρίτα χρώματα και τις αποχρώσεις του
Ονομα | Χρώμα | Γοητεύω | (RGB) |
Γκρί | #808080 | (128,128,128) | |
Γκρί | #bebebe | (190,190,190) | |
(Γκρι-απόχρωση) | #858585 | (133,133,133) | |
Γκρι33 | #545454 | (084,084,084) | |
(Γκρίζα πλάκα) | #708090 | (112,128,144) | |
(Χαλαζίας) | #99958σ | (153,149,140) | |
(Ανοιχτό γκρι) | #bbbbbb | (187,187,187) | |
(Ασήμι) | #c0c0c0 | (192,192,192) | |
(Γκρι-λευκό) | #f0f0f0 | (240,240,240) | |
(Τα γένια του Abdel-Kerim) | #e0e0e0 | (224,224,224) | |
Ανοιχτό γκρι (ανοιχτό γκρι) | #d3d3d3 | (211,211,211) | |
LightStateGray() | #778899 | (119,136,153) | |
StateGray-1 (Απαλό γαλάζιο αραβοσίτου1) | #c6e2ff | (198,226,255) | |
StateGray-2 (Απαλό γαλάζιο αραβοσίτου2) | #b9d3ee | (185,211,238) | |
StateGray3() | #9fb6cd | (159,182,205) | |
StateGray4() | #6c7b8b | (108,123,139) |