# Sølvgradient: metalliske koder, og hvordan du lyssætter dem

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

Forskellen på sølv og almindelig grå er lys. Her er seks sølvgradienter, du kan kopiere, de fire regler, der får dem til at ligne metal, og CSS til tekst, knapper og børstede flader.

## The short version

- En sølvgradient ligner metal frem for grå, når den kombinerer et svagt køligt skær, et stort spænd fra mørk til lys og et smalt, lyst højlys.
- Poleret sølv har hårde overgange og stærk kontrast, satinsølv har bløde overgange, og børstet sølv tilføjer fine parallelle linjer.
- Helt neutrale grå ser ofte flade og støvede ud, så de mest overbevisende sølvtoner hælder en anelse mod blå eller, for platin og tin, en anelse mod varm.
- Lange, subtile grå gradienter er særligt udsatte for banding, som et fint kornlag skjuler.
- Sølvgradienter virker bedst på skrift, kanter, knapper og små former mod en mørk bund.

En **sølvgradient** ligner metal, når den har tre ting, almindelig grå mangler: et svagt køligt skær, et stort spring mellem det mørkeste og det lyseste stop og et højlys, der er smalt frem for udbredt. En pålidelig startkode er `linear-gradient(135deg, #5f6670, #c9cfd6, #f7f9fb, #a7afb9, #4b525c)`. Nedenfor er seks sølvtoner til kopiering, lysreglerne bag dem og CSS til sølvtekst, knapper og børstet metal.

## Koder til sølvgradienter

- Poleret sølv: `linear-gradient(135deg, #5f6670 0%, #c9cfd6 28%, #f7f9fb 44%, #a7afb9 58%, #4b525c 82%, #9aa2ac 100%)`
- Satinsølv: `linear-gradient(160deg, #8d939b 0%, #c3c8ce 35%, #e4e7ea 55%, #b5bbc2 75%, #8a9098 100%)`
- Børstet sølv: `repeating-linear-gradient(90deg, #b9bec5 0px, #d3d7dc 1px, #aeb3ba 2px, #c8ccd2 4px)`
- Kølig platin: `linear-gradient(135deg, #6f7680 0%, #d6dce4 30%, #fbfdff 45%, #b9c3cf 60%, #56606c 100%)`
- Varmt tin: `linear-gradient(135deg, #4f4c48 0%, #a39f99 30%, #e3e0da 46%, #9b968f 62%, #4a4743 100%)`
- Sølvlys på sort: `radial-gradient(ellipse at 30% 20%, #e9edf1 0%, #8f97a1 22%, #2b3038 52%, #0c0e11 85%)`

Seks sølvtoner: fire til skrift, kanter og former, én børstet flade og én baggrund. Hver har et mørkt stop og et næsten hvidt højlys.

- Skyggestål: #4b525c
- Gunmetal: #5f6670
- Sølv: #a7afb9
- Lys sølv: #c9cfd6
- Højlys: #f7f9fb

Sølvfarvekoderne bag Poleret sølv. Hver eneste hælder svagt mod blå, og derfor ligner de metal frem for beton.

## Sådan lyssætter du en sølvgradient

Sølv viser, som alt poleret metal, mest reflekteret lys. Din gradient er en malet refleks, så tænk over, hvor lyset kommer fra, og hvor skarpt fladen fanger det.

1. **Giv de grå et svagt køligt skær** Tilføj en anelse blå til hvert stop, lige nok til at det grå ikke længere ligner støv eller cement.
2. **Gå mørkere, end det føles rigtigt** Metal kræver en dyb skygge. Dit mørkeste stop skal være en gunmetal, ikke en mellemgrå.
3. **Hold højlyset smalt** Et næsten hvidt bånd over en lille del af gradienten opfattes som glans. Et bredt lyst område opfattes som en bleg grå flade.
4. **Vælg poleret eller satin** Saml stoppene tæt for poleret sølv med skarpe reflekser; spred dem ud for en blød satinfinish.

Skru kontrasten helt op med en hård horisontlinje gennem midten, så bliver sølv til spejlblank krom; [kromeffekt på tekst](https://gradiently.design/da/guide/chrome-effect) dækker den udgave. For et varmt metal efter samme logik, se [guldgradient](https://gradiently.design/da/guide/gold-gradient-design).

## Sølv og almindelig grå

### Ligner grå

- Helt neutrale grå
- To stop, fra lysegrå til mellemgrå
- Kun jævne, blide overgange
- Et bredt lyst område uden tydeligt højlys
- Store flade sølvområder på en hvid side

### Ligner sølv

- Grå med et svagt køligt eller varmt skær
- Fem eller seks stop, fra gunmetal til næsten hvid
- Én skarpere refleks et sted
- Et smalt, lyst højlys skævt for midten
- Sølvdetaljer på en mørk bund

Vil du faktisk have en rolig, neutral flade frem for metal, er det en anden opgave: [grå gradient](https://gradiently.design/da/guide/grey-gradient) og [monokrom gradient](https://gradiently.design/da/guide/monochrome-gradient) dækker bløde, tonale grå til baggrunde.

## Hvilken sølvfinish skal du bruge

Hver finish siger noget lidt forskelligt, så vælg den efter opgaven frem for af vane. Et brand kan sagtens bruge to, for eksempel poleret sølv til et logo og børstet sølv til emballagepaneler, så længe skæret er det samme.

| Finish | Sådan ser den ud | Brug den til |
| --- | --- | --- |
| Poleret | Skarpe reflekser, stærk kontrast, et lyst, smalt højlys | Logoer, overskrifter, prisgrafik |
| Satin | Bløde overgange, blid glans, lidt kontrast | Store flader, emballage, stille baggrunde |
| Børstet | Fine parallelle linjer under en blød glans | Paneler, produktsider, tekniske brands |
| Platin | Køligt, lyst, næsten hvidt højlys | Eksklusive niveauer, jubilæer, smykker |
| Tin | Mørkere, varmere, blødere | Tradition, håndværk, herremode |

Fem sølvfinisher, og hvor hver hører hjemme. Alle er bygget efter de samme lysregler; kun kontrast, skær og afstanden mellem stop ændres.

## Sølvtekst og knapper i CSS

```css
.silver-text {
  font-weight: 800;
  font-size: clamp(2.5rem, 8vw, 6rem);
  color: #a7afb9; /* fallback */
  background: linear-gradient(
    135deg,
    #5f6670 0%, #c9cfd6 28%, #f7f9fb 44%,
    #a7afb9 58%, #4b525c 82%, #9aa2ac 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.silver-button {
  padding: 0.85rem 1.6rem;
  border: 1px solid #4b525c;
  border-radius: 999px;
  color: #1c2026;
  font-weight: 600;
  background: linear-gradient(180deg, #f7f9fb 0%, #c9cfd6 48%, #a7afb9 52%, #d9dee3 100%);
  box-shadow: inset 0 1px 0 #ffffff, 0 2px 4px rgb(0 0 0 / 0.25);
  cursor: pointer;
}

.silver-button:hover {
  background: linear-gradient(180deg, #ffffff 0%, #d6dbe0 48%, #b3bac3 52%, #e3e7eb 100%);
}

.brushed {
  background:
    repeating-linear-gradient(90deg, #b9bec5 0px, #d3d7dc 1px, #aeb3ba 2px, #c8ccd2 4px);
}
```

Sølvoverskrift, en pilleformet knap med delt refleks og et panel i børstet metal. Knappens mørke tekst holder etiketten læsbar.

Knappen bruger et trin på midten, fra 48 % til 52 %, som opfattes som en horisont spejlet i en buet flade. [Gradientknapper i CSS](https://gradiently.design/da/guide/css-gradient-button) har flere knapmønstre, og [gradienttekst](https://gradiently.design/da/guide/css-gradient-text) forklarer tekstbeskæring og understøttelsen på tværs af browsere.

> **Grå bander let** Lange, subtile grå gradienter er der, hvor banding viser sig mest, især når en platform har komprimeret dit billede. Tilføj et fint kornlag, og eksportér PNG i fuld størrelse. [Banding i gradienter](https://gradiently.design/da/guide/gradient-banding) forklarer hvorfor.

## Design med sølv

Sølv virker moderne, køligt og præcist, hvor guld virker varmt og traditionelt. Det passer til teknologilanceringer, ure og smykker, jubilæer (sølv er det traditionelle 25-års), vinterkampagner og alt med et futuristisk præg. Ligesom guld ser det mest værdifuldt ud i små doser på en mørk bund: et monogram, en tynd streg, en enkelt titel.

En stående invitation til sølvbryllup med køligt metallisk lys og ordene Femogtyve år

En invitation til et jubilæum, hvor køligt, metallisk lys bærer temaet, og ordene forbliver rolige.

Et stående produktopslag, der annoncerer et stålur på en mørk, kølig baggrund

Et produktopslag til et ur: en mørk, kølig flade med sølv som lys, ikke som flad grå fyld.

Sølv passer også godt til isblå og dyb marineblå i en vinterpalet og til sort og hvid i et stramt, redaktionelt udtryk. [Luksuriøse farvepaletter](https://gradiently.design/da/guide/luxury-color-palettes) har flere kombinationer bygget op om kølige metaller. I Studio i Gradiently tegnes en kølig, metallisk Mark live bag dine ord i alle størrelser, og Automatisk farve vælger lys eller mørk skrift til hver linje ud fra din Marks egen palet, så sølvflader forbliver læsbare, uden at du skal tjekke hvert format.

## FAQ

### Hvad er en god kode til en sølvgradient?

Prøv `linear-gradient(135deg, #5f6670, #c9cfd6, #f7f9fb, #a7afb9, #4b525c)`. Den går fra gunmetal gennem lys sølv til et næsten hvidt højlys og tilbage.

### Hvilke hexkoder giver metallisk sølv?

En kombination som #4b525c, #5f6670, #a7afb9, #c9cfd6 og #f7f9fb. Hver hælder en anelse mod blå, hvilket forhindrer den i at ligne almindelig grå.

### Hvordan laver jeg en effekt med børstet metal i CSS?

Brug en gentagende lineær gradient med bittesmå stop en pixel eller to fra hinanden i nærtliggende grå, som `repeating-linear-gradient(90deg, #b9bec5 0px, #d3d7dc 1px, #aeb3ba 2px, #c8ccd2 4px)`.

### Hvorfor ser min sølvgradient grå ud?

Den mangler sandsynligvis kontrast og et højlys. Tilføj et mørkere gunmetal-stop, et smalt, næsten hvidt bånd og et svagt køligt skær til hvert stop.

### Hvad er forskellen på sølv- og platingradienter?

I design er platin som regel en lidt køligere, lysere sølv med et hvidere højlys, mens tin er en mørkere, varmere sølvgrå.

### Hvilken baggrundsfarve får sølv til at se bedst ud?

Mørke bunde som sort, koksgrå, dyb marineblå eller midnatsblå. Sølv på hvid eller lysegrå mister sit højlys og ser ofte fladt og udvasket ud.