# Silkegradienter: myke folder av lys og farge

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

Silke er et av få materialer vi kjenner igjen bare på lyset. Riktige folder og riktig glans får en flat skjerm til å virke eksklusiv. Her er fargene og strukturen bak uttrykket.

## The short version

- En silkegradient etterligner drapert stoff med lange, myke folder, smale høylys på hver rygg og dype, fargede skygger i hver dal.
- Høylysene i silke er mye smalere enn skyggene. Den ubalansen leses som glans fremfor vanlig skygging.
- Changérende silke veves med tråder i to farger og skifter derfor fargetone mellom høylys og skygge, for eksempel blågrønt i lyset og fiolett i foldene.
- Skygger i silke bør være en dypere, mer mettet versjon av stoffets farge, aldri grå.
- Silkegradienter passer til luksus, skjønnhet, smykker og bryllup fordi selve materialet signaliserer omtanke og kostbarhet.

En **silkegradient** etterligner drapert stoff: lange folder av farge, hver med et smalt høylys langs ryggen og en myk, dyp skygge i dalen. Mønsteret av smalt lys og bred skygge er det øyet leser som glans. Det er et materialuttrykk fremfor et fargeuttrykk. Derfor kan samme champagne- eller smaragdgrønne farge virke flat i en enkel overgang og luksuriøs som silke. Du trenger tre ting: en stofffarge, et høylys som er lysere og litt varmere, og en skygge som er dypere og mer mettet.

## Slik fanger silke lyset

Silkefibre er glatte og litt prismeformede, så de reflekterer lyset konsentrert. En fold i silke gir et raskt, skarpt høylys der den vender mot lyset, og en lang, myk overgang til skygge. Matt bomull i samme fold ville gitt en bred, dempet gradient uten en skarp topp. Gjenskap disse egenskapene, så begynner enhver farge å ligne silke.

| Del av en fold | Slik ser den ut | I gradienten din |
| --- | --- | --- |
| Høylys på ryggen | Smalt, lyst, nesten hvitt | Et smalt fargestopp, 2 til 4 prosent bredt |
| Flanke | Den egentlige stofffargen | Bredt bånd på hver side av høylyset |
| Skygge i dalen | Dyp, mettet, myke kanter | Det bredeste båndet, mørkere og rikere |
| Reflektert lys | Et svakt løft inne i dalen | Et litt lysere fargestopp i skyggen |

Én fold, delt opp. Gjenta den i ulike bredder over bildet, så får du drapering.

## Koder til silkegradienter

Hver av disse er én lineær gradient med innebygde folder: ulike båndbredder, skarpe høylys og brede skygger. De fungerer som bakgrunner alene og som base for varianten med flere lag lenger ned.

- Champagnesilke: `linear-gradient(115deg, #6b4f2a 0%, #c8a46a 18%, #f7ead0 23%, #b8925a 30%, #5a3f1e 48%, #a8844f 62%, #efdcb6 66%, #8c6a3a 74%, #4a3216 100%)`
- Smaragdsilke: `linear-gradient(110deg, #022c22 0%, #047857 20%, #a7f3d0 25%, #059669 32%, #013d2c 52%, #065f46 66%, #6ee7b7 70%, #064e3b 78%, #011c15 100%)`
- Midnattssilke: `linear-gradient(120deg, #0b1026 0%, #1e2a5a 20%, #9fb3e8 25%, #26346e 32%, #070b1c 52%, #1c2752 66%, #7d93d4 70%, #151d40 78%, #05070f 100%)`
- Rosa silke: `linear-gradient(115deg, #7a2e3e 0%, #d97a8c 20%, #fde4e8 24%, #c8607a 31%, #5e1f2e 50%, #b85068 64%, #f8c8d2 68%, #8e3348 76%, #4a1622 100%)`
- Okseblodrød silke: `linear-gradient(118deg, #3a0d0d 0%, #9b1c1c 20%, #f8b4b4 24%, #b91c1c 31%, #2b0808 52%, #7f1d1d 66%, #fca5a5 70%, #5c1212 78%, #1f0505 100%)`
- Elfenbenssilke: `linear-gradient(115deg, #e7e5e4 0%, #f5f5f4 20%, #ffffff 24%, #d6d3d1 31%, #a8a29e 50%, #d6d3d1 64%, #fafaf9 68%, #c4bfbb 76%, #9c9692 100%)`

Seks silkevarianter med to folder hver. Høylysenes fargestopp er bare fire prosent brede. Gjør du dem bredere, blir glansen til en vanlig stripe.

Hold vinkelen mellom 100 og 125 grader, slik at foldene faller diagonalt, som stoff som henger fra ett hjørne. En helt loddrett fold ligner en gardin, mens en vannrett ligner et bånd. Mørke varianter som midnatt og okseblod er mest tilgivende, fordi skyggene skjuler klønete overganger. De passer naturlig med gullfarget tekst, som i [svarte og gylne gradienter](https://gradiently.design/nb/guide/black-and-gold-gradient).

## Changérende silke: to farger i ett stoff

Changérende silke veves med én trådfarge på langs og en annen på tvers. Når stoffet snur, ser du mer av den ene eller den andre, så fargetonen skifter mellom lys og skygge. Det er det mest slående silkeuttrykket å etterligne, og det krever bare én endring: bruk én fargetone til høylys og flanker og en annen til dalene.

- Blågrønt høylys: #99f6e4
- Blågrønn flanke: #14b8a6
- Fiolett fold: #6d28d9
- Fiolett skygge: #2e1065

Changérende silke i blågrønt og fiolett. Lyset virker blågrønt, skyggen fiolett, og midten skimrer mellom dem.

Changérende silke, blågrønt og fiolett: `linear-gradient(115deg, #2e1065 0%, #14b8a6 19%, #ccfbf1 23%, #2dd4bf 28%, #6d28d9 40%, #2e1065 52%, #0f766e 64%, #99f6e4 68%, #5b21b6 78%, #1e0a45 100%)`

Fargeskiftet skjer på skråningen inn mot hver fold. Kombiner farger som blandes gjennom en ren mellomtone, som blågrønt og fiolett eller gull og rosa.

## Slik bygger du silkefolder i CSS

Én lineær gradient gir parallelle folder, som ligner plissert stoff. Ekte drapering buer. Legg to gradienter i lag med litt ulike vinkler, én med mykt lys og én med foldene, og legg til en stor radial skygge som lar den ene siden falle bort. Resultatet ligner hengende stoff.

```css
.silk {
  min-height: 100vh;
  background-color: #4a3216;
  background-image:
    radial-gradient(ellipse 70% 90% at 85% 100%, rgba(40, 24, 8, 0.65) 0%, transparent 70%),
    linear-gradient(100deg, transparent 30%, rgba(255, 246, 225, 0.35) 38%, transparent 44%),
    linear-gradient(115deg, #6b4f2a 0%, #c8a46a 18%, #f7ead0 23%, #b8925a 30%,
      #5a3f1e 48%, #a8844f 62%, #efdcb6 66%, #8c6a3a 74%, #4a3216 100%);
}
```

Champagnesilke med en ekstra glans på tvers og en dyp skygge samlet nederst til høyre.

> **Korn gjør det til stoff** Et svært fint støylag med 2 til 4 prosent opasitet antyder veven og hindrer at foldene ligner plast. Hold kornet finere enn du ville gjort for papir. [Gradienttekstur](https://gradiently.design/nb/guide/gradient-texture) sammenligner alternativene.

## Silke mot sateng, flytende gradienter og krom

| Uttrykk | Høylys | Skygge | Føles som |
| --- | --- | --- | --- |
| Silke | Smalt, lyst, varmt | Bred, rik, farget | Diskré luksus |
| Sateng | Bredere og blankere | Kortere, skarpere | Festantrekk, dristig |
| [Flytende](https://gradiently.design/nb/guide/liquid-gradient) | Smale linjer langs virvler | Fargebånd | Flytende maling, energi |
| Krom | Rent hvitt, svært hardt | Nesten svart, hard | Maskiner, Y2K, teknologi |

Fire blanke uttrykk. Bredden og skarpheten på høylyset bestemmer hvilket materiale øyet ser.

## Hvor silkegradienter fungerer best

Silke signaliserer omtanke, noe som gjør den riktig til smykker, parfyme, hudpleie, bryllup, hoteller og eksklusive lanseringer. Kombiner den med en raffinert serifskrift eller en lett, bred sans serif, og bruk få ord. Champagne og elfenben passer til bryllup; smaragd, midnatt og okseblod passer til kveldsbruk og luksus. [Luksuriøse fargepaletter](https://gradiently.design/nb/guide/luxury-color-palettes) og [fargepaletter til bryllup](https://gradiently.design/nb/guide/wedding-color-palettes) har flere kombinasjoner.

En stående parfymelansering med en liten, raffinert overskrift på en dyp silkegradient

Et parfymeinnlegg i 1080×1350, med teksten sentrert på en rolig flanke i stoffet.

Et kort som ber gjestene holde av bryllupsdatoen, med navn på en lys elfenbensfarget silkebakgrunn

En invitasjon på 5×7 in i 1500×2100, med elfenbenssilke og navnene i det roligste båndet.

### Ligner plast

- Høylys som er like brede som skyggene
- Grå skygger
- Helt parallelle folder
- Ingen korn, så det ligner en rendring

### Ligner silke

- Smale, lyse høylys
- Skygger som utdyper stofffargen
- Folder som krysser og buer
- Et svakt hint av fint korn

Marks fra Gradiently legger opptil tre materialer i lag med eget lys og korn, slik at en overflate kan få dybde og glans uten at du bygger folder for hånd. Hver Mark gjengis i full kvalitet i alle størrelser du designer i, fra invitasjon til story, og holder området bak teksten rolig. Søk på Markedet med fargeord som «champagne» eller «smaragd».

## FAQ

### Hvordan lager jeg en silkegradient?

Bruk en lineær gradient med ujevne bånd: smale, nesten hvite høylys, brede bånd av stofffargen og brede, dypere skygger. Legg til en ekstra glans i en litt annen vinkel for buet drapering.

### Hvilke farger ser best ut som silke?

Champagne, elfenben, smaragd, midnattsblått, rosa og okseblod fungerer godt fordi de har en tydelig lys og mørk versjon. Svært lyse pasteller trenger ekstra dybde i skyggene.

### Hva er changérende silke?

Silke vevd med tråder i to farger, slik at fargetonen skifter når stoffet beveger seg. I en gradient bruker du én fargetone til høylysene og en annen til skyggene.

### Hva er forskjellen mellom silke- og satingradienter?

Sateng har bredere, blankere høylys og kortere, skarpere skygger. Silke har smale, lyse høylys og brede, rike skygger, noe som gir et roligere uttrykk.