Gradient map: farg om hva som helst på sekunder

Et gradient map farger om et bilde ved å bytte ut hver av tonene med en farge fra en gradient. Bildet leses først som ren lysstyrke, fra svart til hvitt, og så byttes hver lysstyrke ut med fargen på samme punkt langs gradienten: venstre ende maler skyggene, høyre ende maler høylysene. Formene, lyset og detaljene i bildet forblir nøyaktig de samme. Bare fargene endres, og du velger alle sammen.

Slik fungerer et gradient map

Tenk på gradienten som en oppslagstabell. En piksel med 0 % lysstyrke får fargen helt til venstre; en piksel med 50 % lysstyrke får fargen på midten; en piksel med 100 % får fargen helt til høyre. Fordi oppslaget bare avhenger av lysstyrke, ender to svært ulike originalfarger med samme lysstyrke, som en rød genser og en grønn hekk, opp med samme farge. Det er det som gjør gradient maps så gode til å samle bilder.

Ramper for gradient map som fungerer

Den aller viktigste regelen: rampen bør bli jevnt lysere fra venstre mot høyre. Da forblir mørke ting mørke og lyse ting lyse, og bildet beholder dybdefølelsen. Du kan skifte fargetone så mye du vil underveis. Klassiske fotografiske uttrykk, som sepia og cyanotypi, er bare slike ramper.

Å bryte lyshetsregelen med vilje gir et solarisert, psykedelisk uttrykk, som kan være gøy på plakater. For alt som fortsatt skal se ut som et foto, holder du rampen jevn. Blir en mellomtone grå, er løsningen den samme som for enhver gradient: se grumsete gradienter.

Hva du kan bruke gradient maps til

• Enhetlige bildesett: arkivbilder, mobilbilder og gamle bilder fra skuffen kommer alle ut i én palett; se konsekvent merkevare
• Merkevareteksturer: gjør en hvilken som helst gråtonetekstur, som skyer, betong, stoff eller støy, til en bakgrunn i merkevarefargene dine; se bakgrunnstekstur
• Illustrasjoner og ikoner: farg om et helt sett på én gang ved å tilordne gråtonene
• Fargegradering: sett et lag med gradient map til Soft Light eller Color med lav opasitet for et diskret filmuttrykk over originalfargene
• Data og vitenskap: varmekart og bilder i falske farger er gradient maps av målinger
• Duotone og tritone: to eller tre stopp for dristige plakatuttrykk; se duotone-effekten

Slik bruker du et gradient map i et bildeprogram

1. 1

   Legg til en justering med gradient map

   Photoshop, Affinity Photo og GIMP har alle en. Bruk et justeringslag der du kan, så originalen forblir urørt.

2. 2

   Sett endene først

   Legg en nesten svart versjon av den mørkeste merkevarefargen din til venstre og en blek tone til høyre. Sjekk at bildet fortsatt leses.

3. 3

   Legg til stopp for mellomtonene

   Plasser hovedfargen i merkevaren rundt 50 %, og juster posisjonen til hud, himmel eller viktige gjenstander ser riktige ut.

4. 4

   Bland det tilbake om nødvendig

   For gradering i stedet for full omfarging endrer du lagets blandingsmodus til Soft Light eller Color og senker opasiteten.

5. 5

   Lagre rampen

   Lagre gradienten som en forhåndsinnstilling, og bruk den på hvert bilde i settet, så alle stemmer overens.

Et gradient map i CSS

Nettlesere kan bruke et gradient map med et SVG-filter. feColorMatrix gjør bildet til gråtoner, og feComponentTransfer tilordner det gjennom en tabell med verdier for hver kanal. Hver liste nedenfor er rampen Merkevarefiolett: verdiene for rødt, grønt og blått i de fem stoppfargene delt på 255, i jevnt fordelte posisjoner.

<svg width="0" height="0" style="position:absolute" aria-hidden="true">
  <filter id="brand-violet-map" color-interpolation-filters="sRGB">
    <feColorMatrix type="matrix" values="0.2126 0.7152 0.0722 0 0
                                         0.2126 0.7152 0.0722 0 0
                                         0.2126 0.7152 0.0722 0 0
                                         0      0      0      1 0"/>
    <feComponentTransfer>
      <!-- #120b1f  #3b1d6e  #7c3aed  #f0abfc  #fdf4ff -->
      <feFuncR type="table" tableValues="0.071 0.231 0.486 0.941 0.992"/>
      <feFuncG type="table" tableValues="0.043 0.114 0.227 0.671 0.957"/>
      <feFuncB type="table" tableValues="0.122 0.431 0.929 0.988 1"/>
    </feComponentTransfer>
  </filter>
</svg>

<img src="texture.jpg" alt="" style="filter: url(#brand-violet-map)">

Gradient maps er måten du kommer deg fra et hvilket som helst bilde til en palett du eier. Vil du heller starte fra bildet, finner match et bilde paletten og de nærmeste Marks. I Gradiently kan du også tone ethvert bilde i Studio i fargene til den Mark du bruker, som mono, duotone eller en mykere lasur, og det er et gradient map bygget for deg.