RGB-bordeaux. Kleur in stijlen kan op verschillende manieren worden gespecificeerd: op hexadecimale waarde, op naam, in RGB-, RGBA-, HSL-, HSLA-formaat

Kleurcodes in CSS worden gebruikt om kleuren te specificeren. Meestal worden kleurcodes of kleurwaarden gebruikt om de kleur in te stellen voor de voorgrondkleur van een element (bijvoorbeeld tekstkleur, linkkleur) of de achtergrondkleur van een element (achtergrondkleur, blokkleur). Ze kunnen ook worden gebruikt om de kleur van een knop, rand, markering, hover en andere decoratieve effecten te wijzigen.

U kunt uw kleurwaarden in verschillende formaten opgeven. In de volgende tabel staan ​​alle mogelijke formaten vermeld:

De vermelde formaten worden hieronder in meer detail beschreven.

CSS-kleuren - Hex-codes

Hexadecimale kleurcode is een zescijferige weergave van kleur. De eerste twee cijfers (RR) vertegenwoordigen de rode waarde, de volgende twee vertegenwoordigen de groene waarde (GG) en de laatste twee vertegenwoordigen de blauwe waarde (BB).

CSS-kleuren - korte hexadecimale codes

Korte hex-kleurcode is een kortere vorm van notatie van zes tekens. In dit formaat wordt elk cijfer herhaald om een ​​equivalente kleurwaarde van zes cijfers te produceren. Bijvoorbeeld: #0F0 wordt #00FF00.

De hexadecimale waarde kan worden overgenomen uit elke grafische software zoals Adobe Photoshop, Core Draw, enz.

Elke hexadecimale kleurcode in CSS wordt voorafgegaan door een hekje "#". Hieronder vindt u voorbeelden van het gebruik van hexadecimale notaties.

CSS-kleuren - RGB-waarden

RGB-waarde is een kleurcode die wordt ingesteld met behulp van de eigenschap rgb(). Deze eigenschap heeft drie waarden: één voor rood, groen en blauw. De waarde kan een geheel getal zijn, van 0 tot 255, of een percentage.

Opmerking: Niet alle browsers ondersteunen de eigenschap rgb() color, dus het wordt niet aanbevolen om deze te gebruiken.

Hieronder ziet u een voorbeeld waarin meerdere kleuren worden weergegeven met behulp van RGB-waarden.

Kleurcodegenerator

Met onze service kunt u miljoenen kleurcodes maken.

Browserveilige kleuren

Hieronder vindt u een tabel met 216 kleuren die het veiligst en computeronafhankelijk zijn. Deze kleuren in CSS variëren van 000000 tot FFFFFF hexadecimale code. Ze zijn veilig in gebruik omdat ze ervoor zorgen dat alle computers kleuren correct weergeven wanneer ze met het 256 kleurenpalet werken.

Tabel met "veilige" kleuren in CSS
#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

Minecraft-codes kleuren of Minecraft codes opmaak, zodat elke speler bloemen kan toevoegen en tekst op elke mogelijke manier rechtstreeks in Minecraft kan opmaken. Kleurcodes van &0-9 - tot &a-f. Voeg ze toe vóór uw tekst. Berichten van spelers kunnen kleurcodes bevatten waarmee je kleur aan je zinnen kunt toevoegen.

Kleuren en opmaakcodes

Het ampersand-teken (&), gevolgd door een hexadecimaal getal in berichten, geeft aan dat de client van kleur moet wisselen bij het weergeven van tekst. Bovendien kan tekst worden opgemaakt met een & gevolgd door een letter. U kunt verschillende kleuren toevoegen aan boeken, opdrachtblokken, servernaam, serverbeschrijving (motd), wereldnamen, tekens en zelfs spelersnamen.

Het is heel eenvoudig om uw tekst in configuraties of in het spel op te maken met behulp van de onderstaande kleurenkaart. &r wordt gebruikt om alle codes te resetten, d.w.z. &mAAA&rBBB wordt weergegeven als AAA BBB.

Voor uw gemak presenteren we een tabel met bestaande kleurcodes in Minecraft:

CodeNaamTechnische naamSymbool kleurSymbool schaduwkleur
RGBHexRGBHex
&0 Zwartzwart0 0 0 000000 0 0 0 000000
&1 Donkerblauwdonkerblauw0 0 170 0000AA0 0 42 00002A
&2 Donkergroendonkergroen0 170 0 00AA000 42 0 002A00
&3 Donker blauwgroendonker_aqua0 170 170 00AAA0 42 42 002A2A
&4 Donkerrooddonkerrood170 0 0 AA000042 0 0 2A0000
&5 Donkerpaarsdonkerpaars170 0 170 AA00AA42 0 42 2A002A
&6 Goudgoud255 170 0 FFAA0042 42 0 2A2A00
&7 Grijsgrijs170 170 170 AAAAAA42 42 42 2A2A2A
&8 Donker grijsdonkergrijs85 85 85 555555 21 21 21 151515
&9 Blauwblauw85 85 255 5555FF21 21 63 15153F
&AGroentegroente85 255 85 55FF5521 63 21 153F15
&BBlauw groenaquatisch85 255 255 55FFFF21 63 63 153F3F
&CRoodrood255 85 85 FF555563 21 21 3F1515
&DLichtpaarslichtpaars255 85 255 FF55FF63 21 63 3F153F
&eGeelgeel255 255 85 FFFF5563 63 21 3F3F15
&FWitwit255 255 255 FFFFFF63 63 63 3F3F3F

Soms is het nodig onderstrepen, doorhalen, hoogtepunt welke tekst dan ook. Dit gebeurt met behulp van tekstopmaak. Het wordt op precies dezelfde manier gebruikt als kleuren (we plaatsen het vóór de tekst code, bijvoorbeeld &lMinecraft = Minecraft.

Voor uw gemak vindt u hieronder een tabel met opmaakcodes:

CodeNaam
&kMagische tekst
&lMiniatuur
&MDoorgestreepte tekst
&NOnderstreepte tekst
&OCursieve tekst
&RTekst zonder opmaak

Hexadecimale getallen worden gebruikt om kleuren te specificeren. Het hexadecimale systeem is, in tegenstelling tot het decimale systeem, gebaseerd, zoals de naam al doet vermoeden, op het getal 16. De getallen zijn als volgt: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Cijfers van 10 tot 15 worden vervangen door Latijnse letters. Getallen groter dan 15 in het hexadecimale systeem worden gevormd door twee getallen tot één te combineren. Het getal 255 in decimalen komt bijvoorbeeld overeen met het getal FF in hexadecimaal. Om verwarring bij het bepalen van het getallenstelsel te voorkomen, wordt vóór het hexadecimale getal een hash-symbool # geplaatst, bijvoorbeeld #666999. Elk van de drie kleuren – rood, groen en blauw – kan waarden aannemen van 00 tot FF. Het kleursymbool is dus verdeeld in drie componenten #rrggbb, waarbij de eerste twee symbolen de rode component van de kleur aangeven, de middelste twee - groen en de laatste twee - blauw. Het is toegestaan ​​om de afgekorte vorm #rgb te gebruiken, waarbij elk teken verdubbeld moet worden. De invoer #fe0 moet dus worden beschouwd als #ffee00.

Bij naam

Internet Explorer Chroom Opera Safari Firefox Android iOS
4.0+ 1.0+ 3.5+ 1.3+ 1.0+ 1.0+ 1.0+

Browsers ondersteunen sommige kleuren op basis van hun naam. In tafel 1 toont de namen, hexadecimale code, RGB, HSL-waarden en beschrijving.

Tafel 1. Namen van kleuren
Naam Kleur Code RGB HSL Beschrijving
wit #ffffff of #fff rgb(255.255.255) hsl(0,0%,100%) Wit
zilver #c0c0c0 rgb(192.192.192) hsl(0,0%,75%) Grijs
grijs #808080 rgb(128.128.128) hsl(0,0%,50%) Donker grijs
zwart #000000 of #000 rgb(0,0,0) hsl(0,0%,0%) Zwart
kastanjebruin #800000 rgb(128,0,0) hsl(0,100%,25%) Donkerrood
rood #ff0000 of #f00 rgb(255,0,0) hsl(0,100%,50%) Rood
oranje #ffa500 rgb(255.165,0) hsl(38,8,100%,50%) Oranje
geel #ffff00 of #ff0 rgb(255.255,0) hsl(60,100%,50%) Geel
olijf #808000 rgb(128.128,0) hsl(60,100%,25%) Olijf
limoen #00ff00 of #0f0 rgb(0,255,0) hsl(120,100%,50%) Licht groen
groente #008000 rgb(0,128,0) hsl(120,100%,25%) Groente
aquatisch #00ffff of #0ff rgb(0,255,255) hsl(180,100%,50%) Blauw
blauw #0000ff of #00f rgb(0,0,255) hsl(240,100%,50%) Blauw
marine #000080 rgb(0,0,128) hsl(240,100%,25%) Donkerblauw
wintertaling #008080 rgb(0,128,128) hsl(180,100%,25%) Blauw groen
fuchsia #ff00ff of #f0f rgb(255,0,255) hsl(300,100%,50%) Roze
paars #800080 rgb(128,0,128) hsl(300,100%,25%) paars

RGB gebruiken

Internet Explorer Chroom Opera Safari Firefox Android iOS
5.0+ 1.0+ 3.5+ 1.3+ 1.0+ 1.0+ 1.0+

U kunt de kleur definiëren met behulp van de rode, groene en blauwe waarden in decimale termen. Elk van de drie kleurcomponenten heeft een waarde van 0 tot 255. Het is ook toegestaan ​​om de kleur als een percentage op te geven, waarbij 100% overeenkomt met het getal 255. Geef eerst het rgb-trefwoord op en specificeer vervolgens de kleurcomponenten tussen haakjes. , gescheiden door komma's, bijvoorbeeld rgb(255, 128, 128) of rgb(100%, 50%, 50%).

RGBA

Internet Explorer Chroom Opera Safari Firefox Android iOS
9.0+ 1.0+ 10.0+ 3.1+ 3.0+ 2.1+ 2.0+

Het RGBA-formaat is qua syntaxis vergelijkbaar met RGB, maar bevat een alfakanaal dat de transparantie van het element specificeert. Een waarde van 0 is volledig transparant, 1 is ondoorzichtig en een tussenliggende waarde zoals 0,5 is semi-transparant.

RGBA is toegevoegd aan CSS3, dus CSS-code moet worden gevalideerd tegen deze versie. Opgemerkt moet worden dat de CSS3-standaard nog in ontwikkeling is en dat sommige functies kunnen veranderen. Een kleur in RGB-indeling die aan de eigenschap background-color is toegevoegd, wordt bijvoorbeeld gevalideerd, maar een kleur die aan de eigenschap background wordt toegevoegd, is niet langer geldig. Tegelijkertijd begrijpen browsers de kleur voor beide eigenschappen volkomen correct.

HSL

Internet Explorer Chroom Opera Safari Firefox Android iOS
9.0+ 1.0+ 9.6+ 3.1+ 3.0+ 2.1+ 2.0+

De naam van het HSL-formaat is afgeleid van de combinatie van de eerste letters Hue (tint), Saturate (verzadiging) en Lightness (lichtheid). Tint is de kleurwaarde op het kleurenwiel (Fig. 1) en wordt weergegeven in graden. 0° komt overeen met rood, 120° met groen en 240° met blauw. De tintwaarde kan variëren van 0 tot 359.

Rijst. 1. Kleurenwiel

Verzadiging is de intensiteit van een kleur en wordt gemeten als een percentage van 0% tot 100%. Een waarde van 0% duidt op geen kleur en een grijstint, 100% is de maximale waarde voor verzadiging.

Lichtheid geeft aan hoe helder de kleur is en wordt gespecificeerd als een percentage van 0% tot 100%. Lage waarden maken de kleur donkerder, en hoge waarden maken deze lichter; extreme waarden van 0% en 100% komen overeen met zwart en wit.

HSLA

Internet Explorer Chroom Opera Safari Firefox Android iOS
9.0+ 1.0+ 10.0+ 3.1+ 3.0+ 2.1+ 2.0+

Het HSLA-formaat is qua syntaxis vergelijkbaar met HSL, maar bevat een alfakanaal om de transparantie van het element te specificeren. Een waarde van 0 is volledig transparant, 1 is ondoorzichtig en een tussenliggende waarde zoals 0,5 is semi-transparant.

RGBA-, HSL- en HSLA-kleurwaarden zijn toegevoegd aan CSS3, dus controleer uw code op versiegeldigheid wanneer u deze formaten gebruikt.

HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

Kleuren

Waarschuwing

Alle leeuwenvangmethoden die op de site worden vermeld, zijn theoretisch en gebaseerd op computationele methoden. De auteurs garanderen uw veiligheid bij het gebruik ervan niet en wijzen elke verantwoordelijkheid voor de resultaten af. Vergeet niet dat een leeuw een roofdier en een gevaarlijk dier is!

Arrgh!


Het resultaat van dit voorbeeld wordt getoond in Fig. 2.

Rijst. 2. Kleuren op de webpagina

In HTML kan kleur op drie manieren worden opgegeven:

Een kleur in HTML instellen op basis van de naam

Sommige kleuren kunnen worden gespecificeerd met hun naam, waarbij de kleurnaam in het Engels als waarde wordt gebruikt. De meest voorkomende trefwoorden: zwart, wit, rood, groen, blauw, etc.:

Tekstkleur – rood

De meest populaire kleuren van de World Wide Web Consortium (W3C) standaard:

KleurNaamKleurNaam KleurNaam KleurNaam
Zwart Grijs Zilver Wit
Geel Limoen Aqua Fuchsia
Rood Groente Blauw Paars
Kastanjebruin Olijf Marine Wintertaling

Voorbeeld van het gebruik van verschillende kleurnamen:

Voorbeeld: een kleur opgeven op basis van de naam

  • Probeer het zelf "

Koptekst op rode achtergrond

Koptekst op oranje achtergrond

Rubriek op kalkachtergrond

Witte tekst op blauwe achtergrond

Koptekst op rode achtergrond

Koptekst op oranje achtergrond

Rubriek op kalkachtergrond

Witte tekst op blauwe achtergrond

Kleur opgeven met RGB

Bij de weergave van verschillende kleuren op een monitor wordt het RGB-palet als basis gebruikt. Elke kleur wordt verkregen door drie basiskleuren te mengen: R-rood, G-groen, B-blauw. De helderheid van elke kleur wordt gegeven door één byte en kan daarom waarden aannemen van 0 tot 255. RGB(255,0,0) wordt bijvoorbeeld weergegeven als rood omdat rood is ingesteld op de hoogste waarde (255) en de rest staan ​​op 0. Je kunt de kleur ook als percentage instellen. Elke parameter geeft het helderheidsniveau van de overeenkomstige kleur aan. Bijvoorbeeld: de waarden rgb(127, 255, 127) en rgb(50%, 100%, 50%) zullen dezelfde middengroene kleur instellen:

Voorbeeld: kleur opgeven met RGB

  • Probeer het zelf "

rgb(127, 255, 127)

rgb(50%, 100%, 50%)

rgb(127, 255, 127)

rgb(50%, 100%, 50%)

Kleur instellen op hexadecimale waarde

Waarden R G B kan ook worden opgegeven met behulp van hexadecimale (HEX) kleurwaarden in de vorm: #RRGGBB waarbij RR (rood), GG (groen) en BB (blauw) hexadecimale waarden zijn van 00 tot FF (hetzelfde als decimaal 0-255 ). Het hexadecimale systeem is, in tegenstelling tot het decimale systeem, gebaseerd, zoals de naam al doet vermoeden, op het getal 16. Het hexadecimale systeem gebruikt de volgende tekens: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Hier worden de cijfers van 10 tot 15 vervangen door Latijnse letters. Getallen groter dan 15 in het hexadecimale systeem worden weergegeven door twee tekens te combineren tot één waarde. Het hoogste getal 255 in decimalen komt bijvoorbeeld overeen met de hoogste FF-waarde in hexadecimaal. In tegenstelling tot het decimale systeem wordt een hexadecimaal getal voorafgegaan door een hash-symbool. # #FF0000 wordt bijvoorbeeld weergegeven als rood omdat rood is ingesteld op de hoogste waarde (FF) en de rest van de kleuren is ingesteld op de minimumwaarde (00). Borden na het hekje-symbool # U kunt zowel hoofdletters als kleine letters typen. Met het hexadecimale systeem kunt u de afgekorte vorm #rgb gebruiken, waarbij elk teken gelijk staat aan dubbel. De invoer #f7O moet dus worden beschouwd als #ff7700.

Voorbeeld: HEX-kleur

  • Probeer het zelf "

rood: #FF0000

groen: #00FF00

blauw: #0000FF

rood: #FF0000

groen: #00FF00

blauw: #0000FF

rood+groen=geel: #FFFF00

rood+blauw=paars: #FF00FF

groen+blauw=cyaan: #00FFFF

Lijst met veelgebruikte kleuren (naam, HEX en RGB):

Engelse naam Russische naam Steekproef HEX RGB
Amarant Amarant #E52B50 229 43 80
Amber Amber #FFBF00 255 191 0
Aqua Blauw groen #00FFFF 0 255 255
Azuur Azuur #007FFF 0 127 255
Zwart Zwart #000000 0 0 0
Blauw Blauw #0000FF 0 0 255
Bondi Blauw Bondi-strandwater #0095B6 0 149 182
Messing Messing #B5A642 181 166 66
Bruin Bruin #964B00 150 75 0
Ceruleaans Azuur #007BA7 0 123 167
Donker lentegroen Donker lentegroen #177245 23 114 69
Smaragd Smaragd #50C878 80 200 120
Aubergine Aubergine #990066 153 0 102
Fuchsia Fuchsia #FF00FF 255 0 255
Goud Goud #FFD700 250 215 0
Grijs Grijs #808080 128 128 128
Groente Groente #00FF00 0 255 0
Indigo Indigo #4B0082 75 0 130
Jade Jade #00A86B 0 168 107
Limoen Limoen #CCFF00 204 255 0
Malachiet Malachiet #0BDA51 11 218 81
Marine Donkerblauw #000080 0 0 128
Oker Oker #CC7722 204 119 34
Olijf Olijf #808000 128 128 0
Oranje Oranje #FFA500 255 165 0
Perzik Perzik #FFE5B4 255 229 180
Pompoen Pompoen #FF7518 255 117 24
Paars paars #800080 128 0 128
Rood Rood #FF0000 255 0 0
Saffraan Saffraan #F4C430 244 196 48
Zee groen Groene zee #2E8B57 46 139 87
Moeras groen Bolotny #ACB78E 172 183 142
Wintertaling Blauw groen #008080 0 128 128
Ultramarijn Ultramarijn #120A8F 18 10 143
paars paars #8B00FF 139 0 255
Geel Geel #FFFF00 255 255 0

Kleurcodes (achtergrond) op basis van verzadiging en tint.