# Papirtekstur som baggrund: taktilt design på skærm

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

Papir er den ældste baggrund, der findes, og folk stoler stadig på den. Sådan får du dens varme, fibre og ujævne lys over på en skærm uden at det ligner en indscannet serviet.

## The short version

- En papirtekstur som baggrund kombinerer tre ting: en nuanceret grundfarve, fine fibre eller korn og et let ujævnt lys.
- Rigtigt papir er aldrig helt hvidt, så et overbevisende digitalt papir starter fra en creme-, havre-, grå eller kraftbrun bund.
- Diskret tekstur virker som kvalitetspapir; kraftige folder, kaffepletter og iturevne kanter virker som clipart og går hurtigt af mode.
- Papirtekstur passer til invitationer, menukort, journaler, brevpapirsbrands, bagerier og alt, der skal føles lavet i hånden.
- Mørk skrift på papir kræver samme kontrast som alle andre steder, så test lille tekst, før du tilføjer mere tekstur.

En **papirtekstur** som baggrund får et skærmdesign til at føles trykt, taktilt og lavet i hånden. Den virker, fordi folk læser papir som omsorg: en invitation, et brev, et menukort, hvor nogen har valgt papiret. For at ramme rigtigt skal tre lag arbejde sammen: en varm eller nuanceret grundfarve, en fin fiber eller et fint korn og et lys, der er en smule ujævnt hen over arket. De fleste falske papirer fejler, fordi de overdriver det tredje.

## Hvilket papirudtryk passer til dit design

Papir er ikke én tekstur. Bomuldspapir, kraft, avispapir og washi føles helt forskellige, og hver passer til sin slags brand. Start med at navngive det papir, du efterligner.

| Papir | Grundfarve | Tekstur | Passer til |
| --- | --- | --- | --- |
| Bomuldspapir | `#f6f1e7` | Blødt, ensartet tooth | Bryllupsinvitationer, certifikater, fint brevpapir |
| Ubestrøget creme | `#f3ead8` | Fine fibre, varmt | Menukort, journaler, bogomslag |
| Kraft | `#c8a57a` | Synlige fibre, pletter | Kaffe, bagerier, emballage, markeder |
| Avispapir | `#e9e5dc` | Gråt, let groft | Zines, redaktionelt, protestplakater |
| Genbrugsgrå | `#dcd8d0` | Spættet | Bæredygtige brands, studier |
| Washi | `#f4efe4` | Lange, gennemsigtige fibre | Te, keramik, blomsterhandlere, spa |

Seks papirer og en grundfarve at starte fra. Kopiér hex-koden, og læg teksturen oven på.

- Bomuld: #f6f1e7
- Cremepapir: #f3ead8
- Avispapir: #e9e5dc
- Kraft: #c8a57a
- Bogtrykssort: #2b2420
- Stempelrød: #8a2b1f

Fire papirbunde med en varm sort skrift og ét stempelrødt, den klassiske accent i papirdesign. Brug det røde én gang pr. design.

## Sådan laver du en papirtekstur som baggrund

Du kan bygge et overbevisende papir fra bunden i enhver editor med støj og blandingstilstande. Indscannet papir virker også, men en bygget tekstur skalerer rent til enhver størrelse og viser aldrig scannerens kant.

1. **Fyld bunden** Fyld lærredet med din papirfarve fra tabellen, for eksempel `#f3ead8` til ubestrøget creme.
2. **Tilføj fint tooth** Læg et mellemgråt lag, tilføj monokrom støj, og sæt det til Multiplicer eller Blødt lys på omkring 4 til 8 procent. Det er den overfladekorn, alt papir har.
3. **Tilføj fibre** Tilføj et andet, større støjlag, og stræk eller slør det let i én retning. Ved meget lav dækning ligner det fibre, der løber gennem arket.
4. **Gør lyset ujævnt** Tilføj en blød radial overgang, en tand lysere i det ene hjørne og en tand dybere i det modsatte. Rigtigt papir er aldrig belyst helt jævnt.
5. **Tjek skriften** Læg din mindste tekst ovenpå, og se den på en telefon. Er ét ord sværere at læse, så skru ned for teksturen, før du gør andet.

- Cremepapir, vinduslys: `radial-gradient(ellipse at 20% 15%, #fbf7ef 0%, #f3ead8 50%, #e8dcc4 100%)`
- Kraft, varm lampe: `radial-gradient(ellipse at 75% 25%, #d6b78f 0%, #c8a57a 45%, #b08c60 100%)`
- Avispapir, fladt dagslys: `linear-gradient(170deg, #f1eee7 0%, #e9e5dc 55%, #ddd7cb 100%)`

Det ujævne lys alene. Hver er papirets grundfarve løftet ét sted og gjort dybere et andet, før der er kommet korn på.

Det fine tooth i trin to er samme teknik som i [kornet tekstur](https://gradiently.design/da/guide/textured-background). Papir bruger bare mindre af den, med en varmere bund.

## Diskret papir slår falsk papir

Søgeresultater for papirbaggrunde er fulde af krøllede ark, brændte kanter og kafferinge. De ligner en forlystelsesparks udgave af papir og kæmper mod hvert ord, du lægger på dem. En god papirtekstur er så stille, at folk mærker den, før de ser den.

### Undgå

- Kraftige folder gennem teksten
- Kaffepletter og brændte kanter
- Iturevne kanter på et digitalt opslag
- Et indscannet ark med synlige skygger
- Grå tekst på creme i små størrelser

### Gør

- Fint tooth, lige synligt i fuld størrelse
- Fibre ved meget lav dækning
- Lys, der er svagt ujævnt
- En varm skriftfarve, ikke ren sort
- Én stempel- eller accentfarve, brugt én gang

## Idéer til papirtekstur i rigtige designs

Papir er bedst, hvor et trykt objekt naturligt ville findes. Det er her, det gør sin nytte.

Et bryllupsinvitationsdesign på en blød, cremefarvet papirteksturbaggrund med navne og en dato

En invitation i 5×7 in på 1500×2100. Tooth som bomuldspapir og en varm skrift giver et kort, du kan holde i hånden.

Et socialt opslag fra et bageri på en varm baggrund i kraftpapirstil med en kort overskrift

Et bagerisopslag på kraft. Teksturen siger håndlavet, før nogen har læst et ord.

- **Restaurantmenuer** på ubestrøget creme, sat i en serif. Se [design af restaurantmenu](https://gradiently.design/da/guide/restaurant-menu-design).
- **Nyhedsbreve og journaler**, hvor papir får lang læsning til at føles roligere.
- **Bryllups- og eventinvitationer**; [design af bryllupsinvitation](https://gradiently.design/da/guide/wedding-invitation-design) har layouts.
- **Håndværks- og håndlavede brands**, på kraft eller genbrugsgrå.
- **Citatkort**, hvor én linje på papir føles som en seddel, nogen har skrevet.

## Typografi og skrift på papirbaggrunde

Papir ændrer, hvordan skrift læses. Serifskrifter føles hjemme på creme og bomuld, fordi de er tegnet til tryk; en ren sans på avispapir eller genbrugsgrå virker moderne og lidt industriel. [Serif vs. sans serif](https://gradiently.design/da/guide/serif-vs-sans-serif) forklarer afvejningen. Uanset hvad du vælger, så sæt skriften i en varm næsten-sort som `#2b2420` frem for ren sort, der ser digital ud mod et nuanceret ark.

Hold brødteksten i en behagelig størrelse, og giv den mere vægt, end du ville på hvid: tekstur æder lidt kontrast, især på telefoner. Til korte linjer på papir, som én sætning på et [citatkort](https://gradiently.design/da/guide/quote-card-design), kan du tillade dig en lettere vægt og mere luft. Hvis du vejer papir op mod andre overflader, sammenligner [baggrundstekstur](https://gradiently.design/da/guide/background-texture) de vigtigste familier side om side.

## Papirtekstur i CSS

På en hjemmeside lægger du en gradient med ujævnt lys over grundfarven og tilføjer så et meget let støjlag med SVG. En lavere `baseFrequency`, end du ville bruge til filmkorn, giver en blødere, mere fibret fornemmelse.

```css
.paper {
  position: relative;
  isolation: isolate;
  color: #2b2420;
  background:
    radial-gradient(ellipse at 20% 15%, #fbf7ef 0%, transparent 55%),
    radial-gradient(ellipse at 85% 90%, #e8dcc4 0%, transparent 60%),
    #f3ead8;
}

.paper::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
  opacity: 0.08;
}
```

Cremepapir med vinduslys og et blødt fiberlag. Multiply holder papiret varmt; hæv dækningen lidt til kraft.

Gradiently har papir- og sandmaterialer blandt sine Marks: håndlavede fibre, bløde toner og fint drivende korn, gengivet live i enhver størrelse, med arkets roligste del i bevægelse bag dine ord. Søg i Markedet efter »papir«, eller filtrér på en lys bund for at finde en, og design så med den gratis.

## FAQ

### Hvilken farve har papir i hex?

Rigtigt papir er sjældent helt hvidt. Ubestrøget creme ligger omkring `#f3ead8`, bomuldspapir omkring `#f6f1e7`, avispapir omkring `#e9e5dc` og kraft omkring `#c8a57a`.

### Hvordan laver jeg en papirtekstur i Photoshop eller Canva?

Fyld en papirfarve, tilføj et monokromt støjlag i Multiplicer eller Blødt lys ved lav dækning, og læg så et blødt ujævnt lys på. I værktøjer uden støj kan du lægge et diskret papirbillede ved lav dækning over farven.

### Er en papirtekstur god til tekst?

Ja, hvis den er diskret. Hold tooth fint, brug en mørk, varm skrift, og tjek lille tekst på en telefon, før du tilføjer mere tekstur.

### Hvilke designs passer til en kraftpapirbaggrund?

Kaffe, bagerier, markeder, emballage og håndlavede brands. Kraft virker naturligt og praktisk, så par det med enkel, fed skrift.