Färgtemperatur i design: varmt, kallt och neutralt ljus

Färgtemperatur är hur varmt eller kallt ett ljus eller en färg känns. Varmt betyder att luta mot stearinljusets orange och rött; kallt betyder att luta mot dagsljusets blått; neutralt ligger mittemellan. För ljus mäts den i kelvin, där ett stearinljus ligger kring 1,900 K och en mulen himmel kring 6,500 K. I design använder du den för att sätta stämning: varma paletter känns nära och bekväma, kalla känns lugna och rymliga, och en blandning av de två ger en bild djup.

Kelvinskalan, och varför den verkar bakvänd

Kelvinvärdet kommer från fysiken: det är den temperatur ett idealiskt glödande föremål skulle behöva nå för att avge ljus i den färgen. En metallstång som värms långsamt glöder rött, sedan orange, sedan gulaktigt vitt och vid extrema temperaturer blåaktigt vitt. Så ett högre tal betyder ett blåare ljus, som designers kallar kallare. Vokabulären går åt motsatt håll mot fysiken, och det förvirrar alla till en början.

Den anpassningen spelar roll för skärmar. sRGB-standarden som de flesta webb- och appfärger utgår från använder D65, omkring 6,500 K, som sin vita. Funktioner som nattlägen skiftar en skärms vita varmare, så färgerna du valde ser varmare ut för någon som läser på natten. Designa för standarden och acceptera driften.

Varma, kalla och neutrala färger

Utanför belysning handlar temperatur om vilken sida av hjulet en färg lutar mot. Rött, orange och gult läses varmt; blått, blågrönt och blåviolett läses kallt. Grönt och lila ligger i mitten och kan gå åt båda håll: en oliv är varm, en mynta är kall. Varma och kalla färger tar upp hjulet i detalj; det användbara här är att temperatur gäller även inom en nyans. Det finns varma blå och kalla röda.

Temperatur gör mycket av det känslomässiga arbetet i en palett, ofta mer än själva nyansen. Varma scheman känns nära, sociala och energiska; kalla scheman känns stilla, rymliga och kontrollerade. Färgpsykologi utforskar de associationerna och deras gränser. Temperatur samverkar också med intensitet: en kall palett uppskruvad till full mättnad slutar kännas lugn, och en varm som dämpats rejält börjar kännas vintage snarare än livlig.

Neutrala toner har också en temperatur

Rent grått är sällsynt i bra design. De flesta grå som används väl lutar svagt varmt, mot sten och taupe, eller svagt kallt, mot skiffer och stål. Att blanda de två familjerna i en layout ser ofta lerigt ut utan att någon vet varför. Välj en familj och använd den för bakgrunder, ramar och sekundär text genomgående.

:root {
  /* A warm neutral ramp: pick one family and keep it */
  --grey-50: #f6f3ee;
  --grey-200: #e4ded4;
  --grey-400: #bdb4a7;
  --grey-600: #7d7468;
  --grey-900: #2f2a25;
}

Varma neutrala toner passar mat, gästfrihet, välmående och redaktionella varumärken. Kalla neutrala toner passar mjukvara, finans och allt som ska kännas exakt. Neutrala färgpaletter har fler uppsättningar.

Varmt ljus, kall skugga

Målare har länge lagt märke till att ljus och skugga skiljer sig i temperatur, inte bara i ljusstyrka. Solbelysta ytor blir varma medan skuggor tar upp blått från himlen. Återskapa det i en gradient eller illustration och den känns genast mer verklig än en ljus och mörk version av en enda nyans. Det fungerar också åt andra hållet: kallt månljus med varma lampskuggor.

För bakgrunder är det skillnaden mellan en gradient som känns belyst och en som känns som ett färgprov. Placera det varma ljuset där ögat ska gå först, låt de kalla tonerna samlas vid kanterna och håll texten över den lugnare av de två. Gradientbakgrund går igenom hela metoden.

Färgtemperatur i fotografier

Vitbalans är kamerans gissning av ljusets temperatur. Ett foto taget under varma lampor med dagsljusvitbalans blir orange; ett taget i skugga blir blått. När foton ligger bredvid varumärkesfärger, matcha deras temperatur mot paletten. Ett varmt varumärke med kalla, blå foton känns osammanhängande. Att tona foton i palettens egna färger är en annan lösning: se duotonfoton.

Gradiently Marks bär ljus som en del av sitt recept, så de läses som en belyst yta snarare än ett platt färgprov, i varje storlek du designar i.