Payly
Sign in Start building Dashboard

Ställ in färger, typsnitt och layout

Använd fliken Webbplatsdesign för att ställa in butikens färger, typsnitt, textstorlekar och hörnrundning en gång, för alla sidor samtidigt.

Webbplatsdesign innehåller de inställningar som får hela din butik att se ut som ett varumärke: färger, typsnitt, textstorlekar och hörnrundning. Du ställer in var och en en gång, och alla sidor följer med. Enskilda block kan fortfarande åsidosätta de här inställningarna när du vill det.

Öppna Webbplatsdesign

  1. Öppna redigeraren. Se Redigeraren i korthet.
  2. Klicka på fliken Webbplatsdesign i inställningspanelen till höger.
  3. Klicka på en rubrik för att öppna den: Identitet, Färger, Typografi eller Layout.

Ändringar syns på sidan direkt och sparas automatiskt. Din live-butik ändras när du publicerar.

Färger

Öppna Färger för att se de sju färger som alla sidor byggs av.

Gruppen Färger i Webbplatsdesign med färgerna Accent, Text på accentfärg, Sidbakgrund, Yta, Text, Sekundär text och Kantlinjer, och ett meddelande om att alla färgpar är lätta att läsa
  • Accent: butikens huvudfärg. Knappar och länkar använder den.
  • Text på accentfärg: färgen på orden ovanpå accentfärgen, till exempel en knapptext.
  • Sidbakgrund: färgen bakom dina sidor.
  • Yta: färgen på kort och paneler, till exempel produktkort och formulärrutor.
  • Text: färgen på rubriker och annan huvudtext.
  • Sekundär text: den dämpade färgen som används för brödtext, beskrivningar och finstilt text.
  • Kantlinjer: färgen på tunna linjer och konturer.

Välj en färg

  1. Klicka på en färgruta.
  2. Gör något av detta i väljaren som öppnas:
    • Klicka eller dra i den stora rutan för att ställa in hur ljus och mättad färgen är, och dra i remsan under den för att ändra själva färgen.
    • Skriv eller klistra in en hexkod, till exempel #2B2622, i rutan.
    • Klicka på ett färgprov under Temats färger för att återanvända en färg du redan har, eller på ett under Senaste för en färg du valde nyligen.
    Färgväljaren öppen under Accent, med en färgruta, en nyansremsa, en ruta för hexkod, temats färger och en nyligen använd färg
  3. Klicka var som helst utanför väljaren, eller tryck på Esc, för att stänga den.

Kontrollera att texten går att läsa

Under de sju färgerna kontrollerar Payly att varje textfärg är lätt att läsa mot färgen bakom den. Om allt är bra ser du Alla färgpar är lätta att läsa. Om ett par är för svagt namnger listan det, visar dess kontrastförhållande och hur mycket som krävs, och erbjuder en knapp Åtgärda som justerar textfärgen åt dig.

En kontrastvarning som listar Sekundär text på sidan och Sekundär text på kort, var och en med sitt förhållande och en knapp Åtgärda

Payly hindrar dig inte från att välja ett par med låg kontrast, men ljusgrå text på ljus bakgrund är svår att läsa, särskilt på en telefon i solsken.

Typografi

Öppna Typografi för att välja typsnitt och textstorlekar.

Gruppen Typografi med Brödtextens typsnitt, Bastextstorlek, Brödtextens radavstånd, Rubrikernas typsnitt, Rubrikstorlek, Rubrikvikt och Rubrikens bokstavsavstånd
  • Brödtextens typsnitt: typsnittet för stycken, menyer och knappar.
  • Bastextstorlek: storleken på vanlig text.
  • Brödtextens radavstånd: avståndet mellan textrader. Ett större tal ger mer utrymme.
  • Rubrikernas typsnitt: typsnittet för rubriker. Välj Använd webbplatsens typsnitt om du vill att rubrikerna också ska använda brödtextens typsnitt.
  • Rubrikstorlek: gör alla rubriker större eller mindre, som en procentsats.
  • Rubrikvikt: hur fet rubrikerna är.
  • Rubrikens bokstavsavstånd: gör avståndet mellan rubrikens bokstäver tätare eller glesare.

Välj ett typsnitt

  1. Klicka på rutan Brödtextens typsnitt eller Rubrikernas typsnitt.
  2. Rulla i listan, som visar varje namn i sitt eget typsnitt. Gruppen Rekommenderat högst upp har typsnitt som passar de flesta butiker.
    Typsnittslistan med en sökruta och gruppen Rekommenderat: Inter, DM Sans, Work Sans, Manrope och fler
  3. För att hitta ett typsnitt med namn skriver du i Sök typsnitt….
  4. Klicka på ett typsnitt för att använda det.

Listan omfattar hela Google Fonts-biblioteket. De typsnitt du använder ingår i din butik när du publicerar. Om ett typsnitt saknas i listan skriver du dess exakta namn hos Google Fonts i sökrutan och väljer det under Använd ändå.

Layout

Öppna Layout för två inställningar:

  • Hörnradie anger hur runda hörnen på knappar, kort och bilder är. Skjut till 0 för vassa hörn och åt höger för mjuka. Block vars egen hörnradie är Auto följer den här inställningen.
  • Textriktning är Vänster till höger för de flesta språk. Höger till vänster vänder hela layouten för arabiska, hebreiska, persiska och urdu.

Identitet

Öppna Identitet för att ställa in din Webbläsarikon, den lilla bilden som visas på en webbläsarflik. Använd ett enkelt märke i stället för hela din logotyp, eftersom den visas i ungefär 16 pixlar. Klicka på Ladda upp bild eller Bläddra bland uppladdningar, som beskrivs i Lägg till bilder och använd mediebiblioteket. Om du lämnar den tom används din logotyp.

Din logotyp finns inte här. Den finns i ditt sidhuvud, där den visas. Se Anpassa sidhuvud och sidfot.

Ändra bara ett block

Varje textblock, rubrik och knapp kan åsidosätta webbplatsens typsnitt, storlek och färger. Markera blocket och öppna dess grupp Typografi eller Utseende. Se Redigera text, rubriker och knappar.

Tips: Om du vill ha ett helt annat utseende kan du börja om från en av de färdiga designerna. Se Byt till en annan webbplatsdesign.

Relaterade artiklar

Last updated 2026-10-03
Back to the help center

We use only the cookies needed to keep you signed in, plus first-party analytics. No advertising cookies, no third-party trackers, and we never sell your data.