# Estetiska bakgrunder: så gör du dina egna [Canonical HTML page](https://gradiently.design/sv/guide/aesthetic-backgrounds) Nedladdade bakgrunder delas av alla som hittade samma sida. Att göra egna tar en eftermiddag, och resultatet matchar din mobil, din dator och dina inlägg. ## The short version - En aesthetic-bakgrund är oftast en mjuk yta med låg kontrast, milt ljus och lite textur, snarare än en rörig bild. - De flesta aesthetic-uttryck kommer av en smal palett: tre till fem färger nära varandra i ljushet, med en något djupare ton för djupet. - Lite korn får mjuka gradienter att se ut som film eller papper och döljer de ränder som släta gradienter kan visa. - Gör ett uttryck och exportera det sedan för varje format du använder, till exempel en mobilbakgrund på 1080 gånger 1920, en datorbakgrund på 1920 gånger 1080 och ett inlägg på 1080 gånger 1350. - Håll bakgrundens lugnaste område där klockor, ikoner eller ord kommer att ligga. En **estetisk bakgrund**, eller *aesthetic*, är i praktiken en mjuk färgyta med milt ljus och lite textur: en persikodimma, en salviamorgon, en lavendelskymning, ett mörkt filmaktigt brunt. För att göra en egen väljer du tre till fem färger nära varandra i ljushet, blandar dem mjukt med en enda mild ljuskälla, lägger på lite korn och exporterar samma uttryck för varje skärm och format du använder. Resultatet känns lugnt, personligt och enhetligt, och det är det mesta folk menar med aesthetic. Den här guiden ger dig färdiga paletter med koder, metoden för att göra din egen och en uppsättning storlekar så att mobil, dator och inlägg matchar varandra. För färgtänkandet bakom, se [pastellgradienter](https://gradiently.design/sv/guide/pastel-gradients) och [grunderna i färglära](https://gradiently.design/sv/guide/color-theory-basics). ## Vad som får en bakgrund att se aesthetic ut Titta noga på bakgrunder som folk sparar och delar, så dyker samma drag upp igen och igen. Inget av dem handlar om en särskild färg: de handlar om återhållsamhet. - **Låg kontrast.** Färgerna ligger nära varandra i ljushet, så ingenting hoppar fram. - **Mjuka övergångar.** Blandningarna är långa och gradvisa, utan hårda kanter. - **En ljuskälla.** Ett område är något ljusare, som fönsterljus, vilket ger ytan djup. - **Textur.** Fint korn eller pappersstruktur gör att den känns fysisk snarare än digital. - **Utrymme.** Det finns inget att titta på, och det är precis det som gör den bra bakom ikoner, ord och foton. - Persikodis: `linear-gradient(160deg, #fde2d4 0%, #f9c6c9 50%, #e8c5e5 100%)` - Salviamorgon: `linear-gradient(180deg, #eef2e6 0%, #cfdcc4 55%, #a9bfa3 100%)` - Lavendelskymning: `linear-gradient(165deg, #e9e4ff 0%, #c9bdf2 50%, #9d8fd9 100%)` - Smörljus: `radial-gradient(circle at 30% 20%, #fff6d6 0%, #fbe3a4 45%, #f2c78b 100%)` - Molnblå: `linear-gradient(180deg, #f3f7ff 0%, #d7e6fb 50%, #b9cfee 100%)` - Balettrosa: `linear-gradient(180deg, #fff0f3 0%, #fbd3dc 55%, #f2aebf 100%)` - Dark academia: `linear-gradient(170deg, #4a3b33 0%, #2e241f 55%, #171210 100%)` - Midnattsfilm: `radial-gradient(ellipse at 70% 20%, #3a3560 0%, #1c1a33 50%, #0d0c18 100%)` Åtta aesthetic-bakgrunder som enkla CSS-gradienter. Var och en håller sina färger nära varandra i ljushet, och det är det som gör dem lugna. Ljusa och mörka aesthetic-uttryck följer samma regler åt motsatt håll. De ljusa håller varje färg blek och låter en något djupare ton samlas vid en kant. De mörka håller allt djupt och låter en enda varmare eller ljusare fläck fungera som ljuset, som en lampa i ett svagt upplyst rum. Mörka bakgrunder behöver korn ännu mer, eftersom bandning syns mest i skuggor; [mörka gradientbakgrunder](https://gradiently.design/sv/guide/dark-gradient-backgrounds) går djupare in på det. ## Så gör du din egen aesthetic-bakgrund 1. **Välj ett stämningsord** Ett eller två ord: *lugn söndag*, *havsmorgon*, *gammalt bibliotek*. Stämningar leder till paletter mer pålitligt än färgnamn gör. 2. **Samla tre till fem färger** Hämta dem från ett foto som har stämningen, eller bygg dem för hand. Håll dem nära varandra i ljushet, med en något djupare ton. [Så plockar du en palett ur ett foto](https://gradiently.design/sv/guide/color-palette-from-image) visar hur. 3. **Bestäm ljusets riktning** Avgör varifrån ljuset kommer, oftast uppifrån eller från ett hörn upptill. Lägg den ljusaste färgen där och låt resten falla bort från den. 4. **Blanda mjukt** Använd långa övergångar med stoppen utspridda, eller några överlappande radiella fläckar för en mjukare, molnlik yta. Undvik skarpa stopp. 5. **Lägg på korn** Lite brus över hela bilden. Nog för att kännas, men inte nog för att synas på armlängds avstånd. [Korniga gradienter](https://gradiently.design/sv/guide/grainy-gradients) förklarar varför det fungerar. 6. **Exportera för varje format** Rendera uttrycket i varje storlek du behöver, i stället för att beskära en enda bild, så att ljuset hamnar på rätt ställe. - Linne: #fbe9dd - Aprikosmjölk: #f4d3c2 - Rosenlera: #e9bfb4 - Dammlila: #d7b8c9 - Djup: plommonskugga: #a88ca6 En genomarbetad palett för stämningen *lugn söndag*: fyra närliggande, varma toner och en djupare plommonton som ger djup vid kanterna. > **Varför mjuka bakgrunder får ränder** Milda gradienter med närliggande färger är precis där skärmar visar ränder, särskilt i mörka toner och komprimerade bilder. Korn döljer dem. Ser du band, läs [gradientbandning](https://gradiently.design/sv/guide/gradient-banding). ## Aesthetic-bakgrunder för mobil, dator och inlägg Poängen med att göra egna är att allt kan matcha. Gör ett uttryck och exportera det för varje plats där det ska ligga. Mobiler är högst: många moderna skärmar är högre än 9:16, så exportera en mobilbakgrund med extra höjd, eller kontrollera din skärms exakta storlek, som förklaras i [storlek på mobilbakgrund](https://gradiently.design/sv/guide/phone-wallpaper-size). - Mobilbakgrund 1080×1920: 1080 × 1920 - Dator 1920×1080: 1920 × 1080 - Inlägg 1080×1350: 1080 × 1350 - Kvadrat 1080×1080: 1080 × 1080 En aesthetic, fyra exporter. Placera ljuset för varje format i stället för att beskära en enda bild. Varje format har sina egna röriga zoner. På en mobils låsskärm sitter klockan nära toppen och aviseringarna i mitten. På en dator ligger ikonerna oftast längs en kant. I ett inlägg behöver orden ett lugnt område. Flytta ljuskällan så att ytans lugnaste del hamnar under de elementen. Ett inlägg i stående format med en kort titel på en mjuk, varm gradientbakgrund Ett inlägg i aesthetic-stil: orden ligger i det lugna övre området. En vertikal story med ett kort citat på samma mjuka gradient som inlägget Samma uttryck som en story, renderat för det högre formatet i stället för beskuret. ## Så undviker du att det ser generiskt ut Mjuka pastellgradienter är populära, vilket betyder att standardvarianterna finns överallt. Några små val gör att din känns som din egen. ### Generiskt - En tvåfärgad förinställning från en generator - Perfekt slät, ingen textur - Jämnt belyst från hörn till hörn - Olika uttryck för mobil, dator och inlägg ### Ditt eget - Fyra eller fem färger ur din egen stämning - Fint korn, som film eller papper - En tydlig ljuskälla - Ett uttryck renderat för varje format Vill du hellre utgå från något som redan är färdigt hittar du tusentals Marks på Marknaden i Gradiently, levande gradientbakgrunder med färg, material, ljus, korn och rörelse, som du kan söka på färgord som ”mjuk persika” eller ”djup petrol” och designa med gratis. Studio kan sedan lägga upp samma uttryck för din mobil, din dator och dina inlägg. ## FAQ ### Vad gör en bakgrund aesthetic? Oftast en mjuk palett med låg kontrast, milda övergångar, en enda ljuskälla och lite textur som korn. Det är återhållsamheten, inte någon särskild färg, som ger uttrycket. ### Hur gör jag en aesthetic bakgrundsbild till mobilen? Välj tre till fem närliggande färger, blanda dem mjukt med ljuset nära toppen, lägg på fint korn och exportera i ett högt format, med extra höjd för mobiler som är högre än 9:16. ### Vilka färger är aesthetic? Alla färger kan vara det, om de ligger nära varandra i ljushet och mättnad. Populära familjer är persika och rosa, salvia och grädde, lavendel och gråblått, samt djupa bruna toner för mörkare stämningar. ### Varför har min mjuka bakgrund ränder? Släta gradienter mellan närliggande färger visar bandning på många skärmar, särskilt efter komprimering. Fint korn och export i hög kvalitet döljer det oftast.