# Rosa gradienter som føles moderne, ikke sukkersøte

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

Rosa kan ligne en godteributikk eller et motemagasin. Forskjellen er sjelden selve rosafargen, men det du setter ved siden av den. Her er paletter, kombinasjoner og koder for rosa som føles aktuell.

## The short version

- En rosa gradient blander nyanser av rosa, fra blekrosa og støvet rose til korall og knallrosa, ofte med en nabofarge som fersken, rød eller fiolett.
- Rosa virker sukkersøt når den er blek, mettet og bare satt sammen med andre pasteller, og moderne når den settes sammen med en dyp tone.
- Dype partnere som okseblod, marine, skoggrønn og nesten svart gir rosa kontrast og får den til å virke redaksjonell.
- Hvit tekst fungerer på dype rosatoner som #be185d, men havner under kontrastkravet for brødtekst på lysere rosatoner som #ec4899.
- Støvete, lett grånede rosatoner virker mer voksne enn rene godterirosa, og passer merkevarer innen mote, skjønnhet og kultur.

En **rosa gradient** blander nyanser av rosa, fra blekrosa og støvet rose gjennom korall til knallrosa og bringebær, ofte med en nabofarge som fersken, rød eller fiolett. Rosa har hatt en lang storhetstid i mote, skjønnhet, mat og kultur, men den har en velkjent måte å feile på: for blek, for søt, for sukret. Løsningen er nesten alltid kontrast. Sett rosa sammen med noe dypt, så blir den skarp og redaksjonell. Nedenfor finner du paletter, kombinasjoner og CSS-koder for rosa gradienter som føles moderne.

## Spennet av rosatoner

Rosa er en lysere rød, men familien er bred. Blekrosa og støvet rose er myke og lett grånede, noe som får dem til å virke rolige og voksne. Korall og laks heller mot oransje og føles varme og solfylte. Knallrosa og fuksia heller mot fiolett og føles høylytte og lekne. Bringebær og bær er dype nok til å bære hvit tekst.

- Blekrosa: #fbe4e4
- Støvet rose: #e8b4b8
- Laks: #f9a28b
- Korallrosa: #fb7185
- Knallrosa: #ec4899
- Fuksia: #c026d3
- Bringebær: #be185d
- Bær: #831843

Åtte rosatoner fra blekest til dypest. Myke og grånede til venstre, høylytte i midten, dype til høyre.

Hvilken rosa du velger, setter tonen før noe annet gjør det:

- **Skjønnhet og hudpleie:** blekrosa og støvet rose, ofte med krem og en varm brun.
- **Mote og forlag:** støvet rosa eller knallrosa mot svart, marine eller okseblod.
- **Mat og drikke:** korall, laks og bringebær, fargene til frukt og sorbet.
- **Musikk og uteliv:** knallrosa og fuksia som gløder på nesten svart.
- **Bryllup og papirvarer:** blekrosa og rose på varmt papir, med detaljer i dyp grønn eller burgunder.

Bleke rosatoner overlapper med den bredere pastellfamilien. [Pastellgradienter](https://gradiently.design/nb/guide/pastel-gradients) forklarer hvordan du holder dem friske på tvers av flere fargetoner.

## Hvorfor rosa blir sukkersøt

### Sukkersøt

- Blekrosa blandet med babyblå eller syrin
- Hver farge en pastell, ingenting mørkt
- Ren, klar godterirosa uten noe grått i seg
- Avrundet, boblete skrift i samme rosa

### Moderne

- Rosa satt mot en dyp tone
- Én sterk mørk farge til tekst og tyngde
- Støvete, lett dempede rosatoner
- Skarp skrift i nesten svart eller krem

Ingen av de sukkersøte valgene er gale i seg selv. Barnemerker og godteriprodusenter bruker dem med vilje. Men vil du at rosa skal leses som selvsikker og ikke søt, trenger du tyngde et sted i designet, og en dyp partnerfarge er den raskeste måten å få det på.

## Myke rosa gradienter

Myke rosatoner føles rolige, varme og taktile. De passer til hudpleie, papirvarer, bryllup og velvære. Hold dem litt støvete fremfor klare, og bruk mørkt blekk til teksten.

- Blekrosa papir: `linear-gradient(135deg, #fdf2f0 0%, #f6cfd2 100%)`
- Støvet rose: `linear-gradient(160deg, #f5e1dc 0%, #e8b4b8 55%, #c98b95 100%)`
- Rose til aprikos: `linear-gradient(135deg, #fde2e4 0%, #fed7aa 100%)`
- Kronbladglød: `radial-gradient(circle at 30% 30%, #fff1f2 0%, #fbcfe8 45%, #e9a6c0 100%)`

Myke rosa gradienter. Aprikos og dempet rose holder dem varme uten sukker.

## Rosa med dype toner

Det er her rosa blir redaksjonell. En dyp partner gir rosafargen noe å gløde mot, og gir skriften et solid sted å stå. Kombinasjonene nedenfor er vanlige i mote, forlag og serveringsbransjen av gode grunner.

- Okseblod til rose: `linear-gradient(160deg, #2a0a12 0%, #6b1d2a 50%, #f4a6b8 100%)`
- Marine til rosa: `linear-gradient(160deg, #0f1a33 0%, #3a2a5c 50%, #f9a8c2 100%)`
- Skog og rosa, delt: `linear-gradient(90deg, #14352a 0% 50%, #f7b6c2 50% 100%)`
- Kakao til rose: `linear-gradient(160deg, #1c1210 0%, #4a2c25 50%, #e9a8a0 100%)`
- Rosa lys på svart: `radial-gradient(circle at 70% 80%, #ff7ab8 0%, #7a1f4b 40%, #0d0508 80%)`
- Plomme til bringebær: `linear-gradient(135deg, #3b0764 0%, #9d174d 55%, #fda4af 100%)`

Rosa med dype partnere. Skogkombinasjonen bruker en hard deling, fordi rosa og grønn er nesten motsatte og ville blandet seg til grått.

Grønn og rosa ligger nesten rett overfor hverandre på fargehjulet, så de er et slående par og en dårlig blanding. Hold dem i hvert sitt område, som i delingen over. [Komplementærfarger](https://gradiently.design/nb/guide/complementary-colors) forklarer hvorfor motsetninger blir grå når de blandes.

## Sterke og knallrosa gradienter

Knallrosa er de mest høylytte fargene i familien. De passer til musikk, uteliv, salg og merkevarer som vil bli sett fra den andre siden av et rom. Bland dem mot oransje eller fiolett, aldri mot grønn eller blågrønn.

- Rosa til mandarin: `linear-gradient(135deg, #db2777 0%, #f97316 100%)`
- Stigende bringebær: `linear-gradient(135deg, #be185d 0%, #ec4899 50%, #f9a8d4 100%)`
- Fiolett til rosa: `linear-gradient(135deg, #7c3aed 0%, #ec4899 100%)`
- Rosa solnedgang: `linear-gradient(180deg, #ff4d8d 0%, #ff8a5c 60%, #ffd29d 100%)`

Sterke rosa gradienter. Hver blandes mot en varm eller fiolett nabo, så midten holder seg klar.

Fiolett til rosa er en av de mest velkjente gradientene på nettet. Bruker du den, gjør du den til din med en dyp bunn, et varmt høylys eller korn. Guiden til [lilla gradienter](https://gradiently.design/nb/guide/purple-gradient) har mer om det.

## Rosa i redaksjonelt design

Et stående redaksjonelt omslag med tittelen Mykhetsnummeret på en gradient i rosatoner

Rosa som et magasinomslag: rolig flate, selvsikker skrift.

Et kvadratisk sitatinnlegg med mørk skrift på en myk gradient

Et sitatinnlegg der mørk skrift gir rosafargen tyngde.

Redaksjonell rosa fungerer fordi den behandler fargen som en bunn, ikke som pynt. Én stor flate, romslig luft, skarp antikva eller grotesk i nesten svart eller krem, og én detalj i en dyp partnerfarge. [Redaksjonelt design for sosiale medier](https://gradiently.design/nb/guide/editorial-design-for-social) går gjennom grepene i detalj.

## Tekst på rosa gradienter

| Tekst på bakgrunn | Kontrast | Vurdering |
| --- | --- | --- |
| Hvit på `#831843` | 9.7:1 | Utmerket |
| Hvit på `#be185d` | 6.0:1 | Bra til brødtekst |
| Hvit på `#db2777` | 4.6:1 | Består så vidt for brødtekst |
| Hvit på `#ec4899` | 3.5:1 | Bare stor tekst |
| `#3b0a1e` på `#f472b6` | 6.4:1 | Mørkt blekk fungerer her |
| `#1f2a44` på `#f9c6d0` | 9.5:1 | Marine på rosa: utmerket |

Kontrastforhold etter WCAG, utregnet. Brødtekst trenger 4.5:1, stor tekst 3:1.

```css
.cover {
  background-color: #2a0a12;
  background-image: linear-gradient(160deg, #2a0a12 0%, #6b1d2a 50%, #f4a6b8 100%);
  color: #fdf2f0;
}
```

Okseblod til rose, med kremfarget tekst. Sett ordene i den øvre, mørkere delen av flaten.

På en gradient sjekker du alltid kontrasten der rosafargen er lysest bak teksten. [Tekst på gradient](https://gradiently.design/nb/guide/text-on-gradient) viser hvordan du finner den rolige sonen.

## FAQ

### Hvilke farger passer til rosa i en gradient?

Fersken, korall, rød og fiolett blandes rent med rosa. For kontrast setter du rosa sammen med dype toner som okseblod, marine, kakao eller nesten svart. Hold grønn i et eget område, fordi rosa og grønn blandes til grått.

### Hvordan får jeg rosa til å se mindre barnslig ut?

Bruk støvete eller dype rosatoner i stedet for klar godterirosa, legg til en dyp partnerfarge og sett skriften i nesten svart eller krem fremfor en annen rosa.

### Hvilken tekstfarge fungerer på en rosa gradient?

Hvit fungerer på dype rosatoner som bringebær og bær. På lysere rosatoner bruker du et mørkt blekk, som en dyp burgunder eller marine.

### Hva er CSS-koden for en rosa gradient?

For eksempel gir linear-gradient(160deg, #2a0a12 0%, #6b1d2a 50%, #f4a6b8 100%) en gradient fra okseblod til rose. Alle palettene på denne siden kan kopieres som CSS.