Webfarver er de farver, der anvendes til at designe websider, og de måder, hvorpå disse farver beskrives og opregnes.

Der er flere måder at vælge farver til dele af websiderne på. Farver kan angives som en RGB-triplet (et sæt af tre tal) i hexadecimalt format (en hex-triplet). RGB-triplet kan danne 16 777 216 forskellige farver. Mange almindelige farver kan også vælges ud fra deres almindelige engelske navne. Ofte bruges et farveværktøj eller anden grafiksoftware til at skabe farveværdier.

De første versioner af Mosaic og Netscape Navigator brugte X11-farvenavnene som grundlag for deres farvelister. Det skyldes, at de begge startede som X Window System-programmer.

Hver webfarve har sin egen definition, sRGB. Dette vedrører kromaticiteterne i et enkelt fosfor-sæt, en given overførselskurve, et adaptivt hvidpunkt og visningsbetingelser. Disse er udvalgt til at ligne mange reelle skærme og visningsbetingelser i den virkelige verden. Selv uden farvestyring er de farver, der skabes, ret tæt på de givne værdier. Brugeragenterne kan dog være forskellige i den nøjagtighed, hvormed de viser farverne. Bedre brugeragenter bruger farvehåndtering til at skabe bedre farvegengivelse. Dette er vigtigt for web-to-print-applikationer.



 

RGB, hex og farvenavne — hvordan det virker

RGB står for Red, Green og Blue. En RGB-triplet består af tre værdier, hver typisk i intervallet 0–255. Kombinationen af disse tre kan beskrive over 16 millioner farver (256 × 256 × 256 = 16.777.216). I praksis anvendes disse værdier i flere formater på web:

  • Hex-triplet: Skrivning i hexadecimalt format som #RRGGBB. Eksempel: #FF0000 er rent rød, #00FF00 er grønt, #0000FF er blåt. Der findes også kort notation som #F00 for #FF0000.
  • rgb() / rgba(): CSS-funktioner som rgb(255, 0, 0) eller rgba(255, 0, 0, 0.5) hvor alfa (gennemsigtighed) kan angives.
  • Procent-notation: rgb(100%, 0%, 0%) svarer til rgb(255,0,0).
  • Farvenavne: Mange almindelige farver kan bruges ved navn i CSS (fx red, blue, lightseagreen). Disse navnene stammer historisk fra X11/CSS farvelister.

sRGB og farvestyring

sRGB er en standardiseret farverum, valgt fordi det ligger tæt på farvegengivelsen for mange almindelige skærme og normale visningsbetingelser. Nogle vigtige punkter om sRGB:

  • sRGB har et specifikt hvidpunkt (D65), kromaticiteter for primærfarverne og en overførselskurve (ofte omtalt som en gamma ≈ 2,2). Standarden er formaliseret i bl.a. IEC 61966-2-1.
  • Browsere og systemer uden farvestyring antager ofte, at billeder og farveværdier er i sRGB; derfor vises farver rimeligt konsekvent selv uden profilhåndtering.
  • Moderne, farvestyrede brugeragenter (browsere, billedbehandlingsprogrammer og operativsystemer) kan bruge indlejrede ICC-profiler eller konvertere mellem farverum, så farverne matcher bedre mellem skærme og tryk (web-to-print).
  • Mange professionelle farverum (fx Adobe RGB, ProPhoto RGB) har større farvegamut end sRGB, men hvis disse ikke konverteres korrekt, kan farverne se forkerte ud i en browser, der antager sRGB.

Historik og farvenavne

De tidlige webbrowsere som Mosaic og Netscape Navigator brugte X11-farvenavne som reference, fordi de var udviklet i et miljø, hvor X Window-systemet var centralt. Det er grunden til, at nogle CSS-farvenavne stammer fra den gamle X11-liste.

Praktiske råd og best practices

  • Brug sRGB til web: Gem billeder og vælg farver i sRGB, medmindre du har en bestemt grund til andet. Det giver mest forudsigelig visning på forskellige enheder.
  • Indlejrede profiler: Hvis du arbejder professionelt med billeder, indlejres ICC-profiler ofte i billedfilerne. Moderne browsere håndterer disse profiler bedre, men test altid i målgruppen af browsere.
  • Test kontrast: Sørg for god kontrast mellem tekst og baggrund (følg fx WCAG-retningslinjer) så indhold er læsbart for alle brugere.
  • Vær opmærksom på enhedsforskelle: Skærme varierer i kalibrering, lysstyrke og gamut. Kalibrer dine arbejdsmonitore for mere nøjagtige resultater, især ved tryk.
  • Farveværktøjer: Brug farvevælgere i grafiksoftware eller browserudviklerværktøjer til at hente hex-, rgb- eller HSL-værdier og til at teste farvekombinationer.
  • Overvej HSL/HSLA: CSS understøtter også hsl() og hsla() som kan være nemmere at arbejde med, når du vil justere nuance, mætning eller lyshed.
  • Gennemsigtighed og moderne formater: Ud over rgba() findes også hex8 (#RRGGBBAA) i visse sammenhænge; husk browserkompatibilitet ved brug.

Afsluttende bemærkninger

Webfarver kombinerer teknisk præcision (talværdier og standarder) med designmæssige valg (farveharmoni, kontrast og tilgængelighed). For det meste er sRGB og hex-/rgb-notationerne tilstrækkelige til at opnå konsistente resultater på tværs af moderne browsere og skærme, men når farvenøjagtighed er kritisk (fx ved tryk), bliver korrekt farvestyring og profilkonvertering vigtig.