# Limegrønn gradient: friske koder med kontroll

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

Lime er omtrent så høylytt som grønt kan bli. Brukt med en plan ser den skarp og moderne ut; brukt uten ser den ut som en merkepenn. Her er kodene og reglene som holder den på din side.

## The short version

- En limegrønn gradient blander gultonede grønnfarger som #bef264, #a3e635 og #84cc16, gjerne mot en mørkere oliven, nesten svart eller en nabofarge som gul eller blågrønn.
- Lime er svært lys til å være så mettet, så hvit tekst på den feiler nesten alltid på kontrast, mens en dyp grønn eller nesten svart tekstfarge leses langt bedre.
- Lime gløder mest på en nesten svart bunn, der litt av den bærer et helt design.
- Blander du lime rett inn i lilla eller rosa, får du gjerne en grå midte, så hold de kombinasjonene i hver sine felt eller gå via en brofarge.
- Lime passer til sport, musikk, teknologilanseringer og fersk mat, og fungerer best som aksent, ikke som hele flaten.

En **limegrønn gradient** blander den gule siden av grønt: blek sitrus som `#d9f99d`, klar lime som `#a3e635` og dypere løvtoner som `#65a30d`, ofte tonet ut i nesten svart, oliven, sitron eller blågrønt. Kontrollen kommer fra tre valg: hvor mye av flaten som er lime, hvilken bunn den ligger på, og hvilken farge ordene har. Treffer du på de tre, ser lime gjennomtenkt og aktuell ut. Under finner du limegradientkoder for hver stemning, tekstfargene som leses på dem, og kombinasjonene som holder seg rene.

## Hvorfor lime oppfører seg annerledes enn andre grønne

Lime ligger mellom gult og grønt på fargesirkelen, og som gult er den ekstremt lys selv ved full metning. Det er kilden til både energien og problemene. Den spretter ut av en mørk skjerm, men vasker også ut hvit tekst og sliter på øyet når den fyller en stor flate. En skogsgrønn eller smaragdgrønn oppfører seg mer som blått; lime oppfører seg mer som en merkepenn. Hele familien finner du i [grønne gradienter](https://gradiently.design/nb/guide/green-gradient).

- Sitrusdis: #ecfccb
- Blek lime: #d9f99d
- Frisk lime: #bef264
- Lime: #a3e635
- Løvlime: #84cc16
- Dyp lime: #65a30d
- Oliven: #3f6212
- Limeblekk: #1a2e05

En brukbar limeskala, fra nesten hvit til nesten svart. Gradienter bygd av naboer på denne skalaen blir aldri grumsete.

## Limegrønne gradientkoder på mørk bunn

Det er her lime gjør seg fortjent til ryktet. På en nesten svart bunn leses en liten limeglød som elektrisk uten å bli slitsom, fordi øyet har et mørkt sted å hvile. Hold limen til et hjørne eller et bånd, og la bunnen gjøre mesteparten av jobben.

- Limelys på svart: `radial-gradient(circle at 80% 20%, #a3e635 0%, #3f6212 30%, #0b0f05 70%)`
- Natt til lime: `linear-gradient(160deg, #0b0f05 0%, #1a2e05 45%, #84cc16 100%)`
- Stadionglød: `radial-gradient(ellipse at 50% 110%, #bef264 0%, #4d7c0f 35%, #0a0d06 75%)`
- Dyp blågrønn til lime: `linear-gradient(135deg, #0b1a14 0%, #134e4a 45%, #a3e635 100%)`

Fire mørke limegradienter. Hver holder den klareste limen i ett område, så overskrifter kan ligge på den mørke siden.

Mørke blandinger som disse er der striper viser seg først, særlig etter at en plattform har komprimert dem på nytt. Et fint lag korn løser det, og [mørke gradientbakgrunner](https://gradiently.design/nb/guide/dark-gradient-backgrounds) har flere bunner å prøve.

## Myke lime- og sitruspastellgradienter

Lime dempet mot krem eller mint mister ropet og blir frisk, ren og litt botanisk. Disse passer til kafeer, juicebarer, hudpleie og vårkampanjer. Varm opp den ene enden litt med sitron eller krem, så resultatet føles solfylt og ikke klinisk.

- Sitron til limekrem: `linear-gradient(135deg, #fefce8 0%, #ecfccb 50%, #d9f99d 100%)`
- Lime til mint: `linear-gradient(180deg, #f7fee7 0%, #d1fae5 100%)`
- Sitrussol: `radial-gradient(circle at 30% 30%, #fef9c3 0%, #d9f99d 45%, #bef264 100%)`

Bleke limegradienter for rolige, friske merkevarer. Mørkegrønn tekst leses nydelig på alle tre.

Vil du at fargen skal lene seg mer mot kjølig og ren, ligger [mintgradienter](https://gradiently.design/nb/guide/mint-gradient) rett ved siden av.

## Farger som passer rent med lime

Lime blander seg rent med naboene sine: gult på den ene siden, grønt og blågrønt på den andre. De overgangene holder seg klare hele veien. Problemene starter med farger på andre siden av sirkelen. Lilla og magenta ligger nær limens komplementærfarge, og en rett blanding mellom dem går gjennom en matt grå midte. [Grumsete gradienter](https://gradiently.design/nb/guide/muddy-gradients) viser nøyaktig hvorfor det skjer.

### Unngå

- Lime blandet rett inn i fiolett eller magenta
- Hvit tekst på klar lime
- Lime som fyller hver piksel av en stor plakat
- Lime med rødt, som leses som et varselskilt

### Gjør

- Lime inn i gult, blågrønt eller dyp oliven
- Nesten svart eller dyp grønn tekst på lime
- Lime som glød på mørk bunn eller krembunn
- Lilla eller rosa plassert ved siden av lime, ikke blandet inn

Lime, sitron, mandarin: `linear-gradient(120deg, #a3e635 0%, #facc15 50%, #f97316 100%)`

En hel sitrusrekke. Hvert steg er en nær nabo av det forrige, så midten holder seg klar i stedet for å bli brun.

## Tekstfarger som leses på lime

Fordi lime er så lys, er instinktet om å sette hvit tekst på den nesten alltid feil. Mørk tekst er svaret, helst en svært dyp grønn så hele designet holder seg i én familie. Forholdstallene under er målt med kontrastformelen i WCAG; 4,5:1 er det vanlige minimum for brødtekst. Mer om metoden finner du i [fargekontrast og tilgjengelighet](https://gradiently.design/nb/guide/color-contrast-accessibility).

| Bakgrunn | Tekst | Kontrast | Vurdering |
| --- | --- | --- | --- |
| Lime `#a3e635` | Hvit `#ffffff` | 1,5:1 | Feiler, selv for overskrifter |
| Lime `#a3e635` | Limeblekk `#1a2e05` | 9,7:1 | Utmerket |
| Løvlime `#84cc16` | Hvit `#ffffff` | 2,0:1 | Feiler |
| Blek lime `#d9f99d` | Limeblekk `#1a2e05` | 12,5:1 | Utmerket |
| Oliven `#3f6212` | Hvit `#ffffff` | 7,1:1 | Bra, bruk til den mørke enden |
| Nesten svart `#0b0f05` | Lime `#a3e635` | 12,8:1 | Utmerket, lime som tekstfarge |

På en gradient sjekker du det lyseste punktet bak hver tekstlinje, ikke gjennomsnittsfargen.

Den siste raden er verdt å legge merke til: lime er en fremragende tekstfarge på svart. En limegrønn overskrift over en nesten svart gradient er en av de mest lesbare kombinasjonene som finnes. [Tekst på gradient](https://gradiently.design/nb/guide/text-on-gradient) dekker hva du gjør når ordene krysser begge ender av en blanding.

Et stående produktslipp-innlegg som lanserer tennissko i lime, med lys tekst på en mørkegrønn gradient opplyst av lime i ett hjørne

Sportsklær på mørk bunn med et limelys. Ordene ligger på den mørke siden.

Et stående innlegg for en juicebar med mørkegrønn overskrift på en blek lime- og sitrongradient

Et innlegg for en juicebar på myk sitrusbunn, med dyp grønn tekst.

## Limegradient i CSS for knapper og toppfelt

På nettet fungerer lime glimrende som handlingsknapp på en mørk side og dårlig som bakgrunn for hele siden. Kodebiten under gir et mørkt toppfelt med limeglød og en limeknapp med mørk tekst. Interpolering i OKLCH holder blandingen klar der sRGB ville sunket; [OKLCH-gradienter i CSS](https://gradiently.design/nb/guide/css-gradient-oklch) forklarer syntaksen.

```css
.hero {
  min-height: 80vh;
  background-color: #0b0f05;
  background-image:
    radial-gradient(circle at 85% 15%, #a3e635 0%, transparent 40%),
    linear-gradient(160deg, #0b0f05 0%, #1a2e05 100%);
  color: #f7fee7;
}

.button {
  background: linear-gradient(135deg, #bef264, #84cc16);
  background: linear-gradient(135deg in oklch, #bef264, #84cc16);
  color: #1a2e05;
  border: 0;
  border-radius: 999px;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
}
```

Et mørkt toppfelt med ett limelys, og en limeknapp med dyp grønn tekst. Nettlesere som ikke støtter `in oklch`, hopper over den andre knappebakgrunnen og beholder den første.

## Der en limegrønn gradient fungerer best

- **Sport og trening:** kampdager, påmeldinger til løp, nye drakter. Lime på svart leses som fart.
- **Musikk og uteliv:** klubbkvelder og utgivelsesgrafikk, der den passer naturlig ved siden av [neongradienter](https://gradiently.design/nb/guide/neon-gradients).
- **Teknologi og produktlanseringer:** én enkelt limeaksent får et mørkt grensesnitt til å føles påslått.
- **Fersk mat og drikke:** juice, salater, cocktailer og alt med sitrus, i det mykere pastellspekteret.
- **Vårkampanjer:** blek lime og sitron sier ny sesong uten den vanlige pastellrosaen.

Fordi lime er så gjenkjennelig, er det også lett å ligne alle andre som grep etter den i år. I Gradiently sjekkes hver Mark mot alle de andre og avvises hvis den er for lik, så et limeuttrykk du sikrer deg, er ett ingen andre kan eksportere. Lesbarheten justeres også bak hver linje, så lime havner aldri under hvite ord ved et uhell.

## FAQ

### Hva er hex-koden for limegrønn?

En mye brukt klar lime er `#a3e635`. Blekere lime ligger rundt `#d9f99d` og dypere rundt `#65a30d`. Ren nettlime, `#00ff00`, er mye skarpere og ser sjelden bra ut i design.

### Hvilken tekstfarge passer på en limegrønn gradient?

Bruk en svært mørk grønn som `#1a2e05` eller nesten svart. Hvit tekst på klar lime feiler kraftig på kontrast, med rundt 1,5:1.

### Hvilke farger passer med limegrønn i en gradient?

Gult, sitron, blågrønt, mint og dyp oliven blander seg rent med lime. Lilla og rosa ser slående ut ved siden av, men blir grå hvis du blander rett inn i dem.

### Hvordan lager jeg en neongrønn gradient i CSS?

Legg en limeglød på en nesten svart bunn, for eksempel `radial-gradient(circle at 80% 20%, #a3e635 0%, #3f6212 30%, #0b0f05 70%)`. Det er den mørke bunnen som får lime til å se neon ut.

### Er limegrønn en god merkevarefarge?

Det kan den være, for energiske merkevarer innen sport, musikk, teknologi eller fersk mat. Bruk den som aksent på mørk bunn eller krembunn i stedet for hele flaten, og kombiner den med mørk tekst.
