# Levande bakgrundsbilder av gradienter: gör dina egna

[Canonical HTML page](https://gradiently.design/sv/guide/live-wallpaper)

En gradient som långsamt glider bakom klockan kan få en skärm att kännas levande utan att någonsin kräva uppmärksamhet. Hantverket ligger i att hålla den långsam, mörk och stilla.

## The short version

- En levande bakgrundsbild är en bakgrund för en mobil- eller datorskärm som rör sig, oftast som en långsam loop eller som svar på beröring, tid eller lutning.
- Android stöder levande bakgrundsbilder inbyggt via appar, medan alternativen på iPhone, Mac och Windows beror på systemversionen eller appar från tredje part.
- En bra levande gradientbakgrund rör sig mycket långsamt, loopar utan hack och håller ytan bakom klockan och ikonerna lugn.
- Rörliga bakgrundsbilder drar extra ström, och på OLED-skärmar drar mörkare färger mindre, så mörka, långsamma bakgrundsbilder är skonsammast för batteriet.
- Gör bakgrundsbilden som en loop på 15 till 30 sekunder i skärmens form och behåll en stillbild för när du vill spara ström.

En **levande bakgrundsbild** (live wallpaper) är en bakgrund för din mobil eller dator som rör sig: en långsam loop av färg, en scen som glider eller en bild som reagerar på beröring eller tid på dygnet. Gradienter blir några av de bästa, eftersom ett mjukt färgfält som glider bakom klockan känns lugnt och levande utan att någonsin konkurrera med dina appar. Hantverket är att hålla den långsam, loopa den sömlöst och lämna skärmens livliga delar stilla.

## Var levande bakgrundsbilder fungerar

Stödet skiljer sig mellan system och ändras mellan versioner, så kontrollera vad ditt erbjuder innan du designar. I stora drag:

| System | Vad som är möjligt | Vanlig väg |
| --- | --- | --- |
| Android | Levande bakgrundsbilder är en inbyggd funktion | Appar för bakgrundsbilder; vissa telefontillverkare tar också emot en kort video |
| iPhone | Alternativen för rörelse har ändrats mellan iOS-versioner | Nyare versioner kan spela upp ett Live Photo en kort stund när du väcker låsskärmen |
| Mac | Inbyggda dynamiska och rörliga bakgrundsbilder | Egna videobakgrunder kräver en app från tredje part |
| Windows | Ingen inbyggd videobakgrund | Appar som Wallpaper Engine eller Lively Wallpaper |

En loop du gör som en vanlig videofil kan användas på de flesta av de här vägarna. Kontrollera din enhets aktuella alternativ.

## Vad som gör en levande gradientbakgrund bra

Du kommer att se din bakgrundsbild hundratals gånger om dagen, mest en sekund i taget, medan du försöker göra något annat. Det ändrar reglerna. En levande bakgrundsbild som är spännande första gången blir tröttsam redan dag två. De bästa är nästan stilla: du märker rörelsen först när du letar efter den.

### Tröttsamt

- Snabb rörelse eller färgcykling
- Skarpa färger över hela skärmen
- Detaljer bakom klockan och ikonerna
- Ett synligt hack när loopen upprepas

### Lugnt

- Ett långsamt glid eller ett ljus som andas
- En mörk botten med en enda upplyst färg
- En stilla yta där klockan och ikonerna sitter
- En loop som går ihop utan söm

En hög mobil låsskärm som visar klockan 07:42 över en mörk gradient som är lugn bakom klockan

Designa runt klockan: ytan bakom den ska vara den lugnaste delen av fältet, med färg och rörelse under och runt den.

## Färger för en levande bakgrundsbild

Mörka bottnar är det naturliga hemmet för rörliga bakgrundsbilder. De håller vita ikoner och vit text läsbara i varje ögonblick av loopen, de känns rogivande på kvällen, och på OLED-skärmar, där varje pixel lyser själv, drar mörkare pixlar mindre ström. Välj en nästan svart botten med en ton åt din huvudfärg och låt sedan en eller två upplysta färger röra sig över den. [Mörka gradientbakgrunder](https://gradiently.design/sv/guide/dark-gradient-backgrounds) går djupare in på hur du bygger djup utan dysterhet.

- Violett glöd: `radial-gradient(120% 80% at 30% 85%, #6d28d9 0%, #2e1065 45%, #0b0716 100%)`
- Djup lagun: `radial-gradient(120% 80% at 70% 90%, #0d9488 0%, #134e4a 40%, #04110f 100%)`
- Låg sol: `radial-gradient(120% 80% at 40% 95%, #ea580c 0%, #7c2d12 40%, #120806 100%)`
- Nattblå: `radial-gradient(120% 80% at 60% 90%, #2563eb 0%, #1e3a8a 45%, #060a18 100%)`

Mörka bottnar med ljuset lågt i bilden, bort från klockan högst upp. Var och en skulle kunna glida långsamt i sidled som en loop.

Lägg till lite korn om du kan. Mörka gradienter är där banding syns mest, och ett fint, rörligt korn döljer den samtidigt som det ger ytan en filmisk struktur. [Korniga gradienter](https://gradiently.design/sv/guide/grainy-gradients) förklarar hur mycket du ska använda.

## Storlekar och former för mobil och dator

Gör loopen i formen på skärmen den ska leva på. Mobiler är höga, ungefär 9:19,5 på många nuvarande modeller, och de flesta zoomar eller beskär en bakgrundsbild något, ibland med en parallaxeffekt när du lutar. Datorskärmar är oftast 16:9. Håll den viktiga färgen borta från kanterna så att beskärningar inte tar den. För exakta mobilstorlekar och låsskärmslayout, se [storlekar för mobilbakgrunder](https://gradiently.design/sv/guide/phone-wallpaper-size).

- Mobil, ungefär 9:19,5: 18 × 39
- Dator 16:9: 1920 × 1080

Två former, två layouter. En datorbakgrund beskuren från en mobildesign, eller tvärtom, fungerar sällan.

## Så gör du en levande gradientbakgrund

1. **Designa stillbilden** Börja med en stillastående gradient i skärmens form. Titta på den med dina riktiga ikoner och din klocka ovanpå innan du lägger till rörelse.
2. **Välj en långsam rörelse** Ett glid i sidled, ett långsamt flöde eller ljus som andas. En rörelse, långsammare än det känns nödvändigt.
3. **Gör den 15 till 30 sekunder lång** Längre loopar upprepas mer sällan, så upprepningen är svårare att märka. Mycket långsam rörelse behöver mindre längd.
4. **Sy ihop loopen** Sista rutan måste leda tillbaka in i första utan hack. [Sömlösa loopar](https://gradiently.design/sv/guide/seamless-loop-video) visar hur.
5. **Exportera som video** MP4 är den mest accepterade filen för appar och mobiler för bakgrundsbilder. Behåll en PNG-stillbild från samma design också.
6. **Lev med den en dag** Sätt den och använd mobilen som vanligt. Om du märker den på ett sätt som stör, gör den långsammare eller mörkare.

## Batteri och prestanda

Varje rörlig bakgrundsbild ber din enhet att fortsätta rita, vilket drar en del extra ström. Hur mycket beror på enheten, appen och bakgrundsbilden: långsamma, mörka loopar i skärmens egen upplösning är lättast, och många appar pausar animationen när ett fönster täcker skrivbordet eller mobilen är låst. Om batteriet betyder mer än rörelse en viss dag, byt till stillbilden; den ser likadan ut, bara i vila.

Om du gör din gradient i Gradiently kan du designa den i en egen storlek, exportera den som en loopande video på 5 till 30 sekunder med en långsam rörelse som Drift eller Andas, och exportera en PNG-stillbild av samma design. Loopar görs så att slutet möter början. För fler idéer om bakgrundsbilder, se [gradientbakgrunder för skärmen](https://gradiently.design/sv/guide/gradient-wallpaper) och [estetiska bakgrunder](https://gradiently.design/sv/guide/aesthetic-backgrounds).

## FAQ

### Vad är en levande bakgrundsbild?

Det är en bakgrund för mobil eller dator som rör sig, som en långsam loop av färg, i stället för en stillbild. Vissa reagerar också på beröring, lutning eller tid på dygnet.

### Tömmer levande bakgrundsbilder batteriet?

De drar en del extra ström eftersom enheten hela tiden ritar dem. Långsamma, mörka loopar drar minst, särskilt på OLED-skärmar, och många appar pausar dem när de inte syns.

### Kan jag använda en video som levande bakgrundsbild?

På Android tar många appar för bakgrundsbilder och vissa telefontillverkare emot en video. På Mac och Windows krävs oftast en app från tredje part, och på iPhone beror alternativen på din iOS-version.

### Hur lång ska en loop för en levande bakgrundsbild vara?

15 till 30 sekunder fungerar bra. Ju längre och långsammare loopen är, desto svårare är det att märka var den upprepas.

### Vilka färger fungerar bäst för en levande bakgrundsbild?

En mörk botten med en eller två upplysta färger som rör sig långsamt. Den håller ikonerna läsbara, känns rogivande och drar mindre ström på OLED-skärmar.
