# Bakgrunnstekstur: korn, papir, stoff og glass

[Canonical HTML page](https://gradiently.design/nb/guide/background-texture)

Tekstur er det som får en flat skjermfarge til å føles som en overflate. Brukt svakt gir den varme og skjuler bånd. Brukt kraftig blir den til støy. Her er hvordan du finner grensen.

## The short version

- En bakgrunnstekstur er fin overflatedetalj, som korn, papirfibre, vevd stoff eller frostet glass, lagt over en farge eller gradient.
- Tekstur fungerer best med lav styrke, kjent snarere enn sett, så den gir varme uten å konkurrere med innholdet oppå.
- Teksturens skala bør passe visningsstørrelsen: fint korn til små skjermer og nær visning, grovere tekstur til store formater som ses på avstand.
- Å legge korn over en gradient skjuler bånd, fordi tilfeldig detalj bryter opp de synlige trinnene mellom nyansene.
- Sosiale plattformer og videokodere komprimerer bilder på nytt, noe som kan smøre ut veldig fin tekstur, så sjekk teksturen etter opplasting.

En **bakgrunnstekstur** er fin overflatedetalj lagt over en farge eller gradient: flekkene i filmkorn, fibrene i papir, veven i lin, frosten på glass. Det er det som får en bakgrunn til å leses som et materiale i stedet for som piksler. Regelen som betyr mest, er styrke. En tekstur du kjenner heller enn legger merke til, gjør et design varmere og mer eksklusivt. En tekstur du legger merke til først, blir motivet og kjemper mot alt som ligger oppå.

Et stående innlegg med overskriften Rolige morgener, god kaffe på en mykt teksturert gradient

En teksturert gradient på et stående innlegg: overflaten leses som et materiale, og ordene leder fortsatt.

## Typer bakgrunnstekstur

| Tekstur | Føles som | Best til |
| --- | --- | --- |
| Korn eller støy | Film, trykk, en matt finish | Gradienter, mørke bakgrunner, alt som får bånd |
| Papir | Trykt, håndlaget, redaksjonelt | Sitater, journaler, invitasjoner, rolige merkevarer |
| Stoff og lin | Mykt, vevd, taktilt | Mote, interiør, servering |
| Frostet glass | Moderne, lagdelt, lysende | Grensesnitt, kort over farge, teknologimerkevarer |
| Halvtone og riso-prikker | Retrotrykk, fanziner, plakater | Lekne og redaksjonelle innlegg i sosiale medier |
| Stein og betong | Solid, arkitektonisk, stille | Luksus, arkitektur, produktfotografi |

Vanlige teksturfamilier og assosiasjonene de bringer. Velg én per design.

Hver tekstur bærer en assosiasjon. Korn sier film og trykk, papir sier håndlaget, glass sier grensesnitt. Velg den som passer det merkevaren din skal føles som, og bruk den overalt. Å blande papir i ett innlegg og glass i det neste opphever effekten. Har du ikke bestemt deg for en følelse ennå, har [merkevarepersonlighet](https://gradiently.design/nb/guide/brand-personality) en enkel måte å avgjøre det på.

## Skala: tilpass teksturen til visningsstørrelsen

Tekstur leses ulikt i ulike størrelser. En mobilskjerm som holdes nær, viser hver flekk, så fint korn er nok. En plakat over et rom eller et lysbilde på en projektor trenger grovere tekstur for å registreres i det hele tatt. Og tekstur som ser riktig ut på et innlegg på 1080×1350, kan forsvinne når en plattform krymper den til et miniatyrbilde, eller bli til flekker når den komprimeres på nytt.

- Story 1080×1920: fin: 1080 × 1920
- Innlegg 1080×1350: fin: 1080 × 1350
- Lysbilde 1920×1080: middels: 1920 × 1080
- A3-trykk 3508×4961: grovere: 3508 × 4961

Den samme teksturen trenger en annen skala for hvert format og hver visningsavstand.

På trykk overlever korn som regel godt og hjelper til og med glatte gradienter å gjengis rent. [Å trykke gradienter](https://gradiently.design/nb/guide/print-gradients) tar for seg detaljene.

## Tekstur i lag over gradienter

Den mest nyttige kombinasjonen er tekstur over en gradient. Korn bryter opp de synlige trinnene som dukker opp i glatte overganger, kalt bånd, og det får en digital gradient til å se trykt ut. Den vanlige metoden er å legge teksturen som et eget lag over fargen og blande den inn med en modus som Overlay eller Soft light ved lav dekkevne, så den skygger fargen i stedet for å dekke den.

1. **Begynn med fargen** Få gradienten riktig først. Tekstur redder ikke farger som ikke passer sammen.
2. **Legg til ett tekstur-lag** Plasser det over gradienten. Bruk en grå eller nøytral tekstur så den ikke farger fargen.
3. **Bland det inn** Sett laget til Overlay eller Soft light. Soft light er mildere og holder fargene rene.
4. **Senk styrken** Reduser dekkevnen til du bare legger merke til teksturen når du leter etter den, ofte godt under halvparten.
5. **Sjekk det mørkeste området** Bånd skjuler seg i mørke, langsomme overganger. Kontroller at teksturen har løst opp eventuelle trinn der.

På nettet er den samme tilnærmingen noen få linjer kode. Se [CSS-støytekstur](https://gradiently.design/nb/guide/css-noise-texture). For hvorfor akkurat korn ser så bra ut på gradienter, les [kornete gradienter](https://gradiently.design/nb/guide/grainy-gradients).

## Tekstur og lesbarhet

### Unngå

- Sterk tekstur rett bak liten tekst
- Mønstre med høy kontrast, som kraftig linvev under brødtekst
- To eller tre ulike teksturer i ett design
- Tekstur så fin at den blir til grøt etter opplasting

### Gjør

- Svak tekstur, eller et roligere område der ordene ligger
- Tekstur med lav kontrast i nære nyanser av én farge
- Én teksturfamilie på tvers av alle formater
- Sjekk den opplastede versjonen, ikke bare eksporten

Tekstur gir visuell støy nær bokstavene, og liten tekst lider først. Hold teksturen svak der tekst ligger, eller gi ordene en rolig, jevn del av bakgrunnen. [Tekst på travle bakgrunner](https://gradiently.design/nb/guide/type-on-busy-backgrounds) tar for seg teknikkene i detalj.

Et kvadratisk sitatinnlegg der den teksturerte bakgrunnen går uendret bak teksten

Tekstur og farge som går rett gjennom ordene …

Det samme kvadratiske sitatinnlegget med bakgrunnen roligere og med høyere kontrast bak teksten

… og den samme bakgrunnen som gjør rolig plass bak dem.

## Tekstur som holder seg helhetlig

Tekstur er lett å miste mellom verktøy: et korn-lag i én fil, et papirbilde i en annen, en ulik styrke i hver eksport. I Gradiently er tekstur en del av selve bakgrunnen. En Mark legger opptil tre materialer i lag med korn og lys, så den samme overflaten gjengis bak hvert design i hver størrelse, og det roligste området flyttes bak ordene.

En Mark: farge, materiale og korn gjengitt sammen, identisk i alle formater.

## FAQ

### Hva er en bakgrunnstekstur?

Fin overflatedetalj, som korn, papirfibre, stoffvev eller frostet glass, lagt over en farge eller gradient slik at den leses som et fysisk materiale.

### Hvor sterk bør en bakgrunnstekstur være?

Svak. Du bør bare legge merke til den når du leter etter den. Er teksturen det første du ser, reduser dekkevnen.

### Fikser tekstur bånd i gradienter?

Korn gjør det som regel. Tilfeldig fin detalj bryter opp de synlige trinnene mellom nyansene, så overgangen ser jevn ut.

### Hvilken blandingsmodus bør jeg bruke for tekstur?

Soft light for en mild effekt som holder fargene rene, eller Overlay for en sterkere. Bruk en nøytral grå tekstur så den ikke farger fargen.

### Hvorfor ser teksturen min flekkete ut i sosiale medier?

Plattformer komprimerer opplastinger på nytt, noe som kan smøre ut veldig fin tekstur. Bruk en litt grovere tekstur og sjekk det opplastede resultatet.
