Färgscheman

Du kan definiera olika färgscheman i dina temainställningar och tillämpa dem på olika avsnitt i din webbshop med en färgväljare. Ett färgschema är en uppsättning färger. Temat har en uppsättning tillämpade standardfärgscheman som du kan ändra när som helst i temaredigeraren. Du kan lägga till dina varumärkesfärger för att skapa en sammanhållen tillämpning av din färgpalett över webbshoppen.

Temainställningar för färgschema

Färgscheman är en temainställning som grupperar element och deras respektive färger på ett visuellt representativt sätt. Du kan tilldela olika färger till olika element i ett sammanhållet färgschema som kan tillämpas över ditt tema där det finns en färgschemaväljare tillgänglig. Du kan ha upp till 21 färgscheman. Du kan också förhandsgranska hur dina färger visas i ditt schemas förhandsgranskning.

Inställning	Beskrivning
Bakgrund	Färg tillämpas på bakgrunden i vissa avsnitt och på konturknappens bakgrund.
Tonad bakgrund	En toning av färger tillämpas på bakgrunden i vissa avsnitt. Bakgrundstoningar ersätter bakgrunden när det är möjligt.
Text	Färg tillämpas på avsnittet eller blocktexten.
Enfärgad knappbakgrund	Färg tillämpas på den primära knappbakgrunden.
Enfärgad knappetikett	Färg tillämpas på den primära knapptexten.
Knappkontur	Färg tillämpas på sekundär knapptext och -kant.
Skugga	Färg tillämpas på skuggorna.

Hantera ditt färgschema

Din butiks färgschema och färgalternativ ställs in i dina temainställningar. För solida färger använder du färgväljaren för att välja en ny färg eller anger värdet för färgen i textfältet. Färgfältet accepterar följande färgnamn och värden:

• färgnamn såsom red, black eller blue
• RGB-färgkoder
• hexadecimala färgvärden

Steg:

1. Från din Shopify-admin går du till Webbshop > Teman.
2. Klicka på Anpassa bredvid temat du vill anpassa.
3. Klicka på kugghjulsikonen och sedan på Färger.
4. Klicka på ett befintligt schema i avsnittet Scheman eller klicka på Lägg till schema för att lägga till ett nytt färgschema.
5. Klicka på färgprovet för den innehållstypfärg du vill ändra.
6. Ställ in färg genom att ange hexfärgkoden eller välja färgen från färgväljaren. Radera hexkoden från textfältet för att ställa in färgen till transparent.
7. Klicka på Spara.

Tillämpa ditt färgschema

När du har definierat ditt färgschema i dina temainställningar kan du tilldela ett färgschema med hjälp av färgschemaväljaren i temats avsnitt och block. Färgschemaväljaren är endast tillgänglig i vissa avsnitt, block och allmänna temainställningar.

Toningar

I vissa teman kan du ställa in en toning av färger för att få visuellt intressanta bakgrundsalternativ. Inställningen color_background används för att anpassa CSS-bakgrundsegenskapen.

Tips

Om du vill veta mer om toningar och CSS-bakgrunder kan du läsa Mozillas dokumentation om linjärtoning och CSS-bakgrund.

Toningsväljaren gör det möjligt för dig att välja färger, toningsstil, vinkel, placering och opacitet för toningen. Alternativen som valts i toningsväljaren förhandsgranskas i realtid i temaredigeraren. Du kan även skapa en toningsbakgrund med hjälp av CSS-kod, som innehåller en verifieringskontroll.

Skapa toningar

1. Från din Shopify-admin går du till Webbshop > Teman.
2. Klicka på Anpassa bredvid temat du vill anpassa.
3. Klicka på kugghjulsikonen och sedan på Färger.
4. Klicka på ett befintligt schema som du vill redigera i avsnittet Scheman.
5. Klicka på färgprovsalternativet för toning, till exempel Tonad bakgrund.
6. Om du inte tidigare har ställt in en toning så visas några förinställda alternativ som du kan välja mellan. Välj en förinställd toning för att öppna alternativpanelen.
7. Välj dina toningsalternativ:

• Välj mellan en linjär eller radiell toning. Använd knapparna för att välja önskad toningsstil.
• Ställ in vinkel på toningen med uppåt- och nedåtpilarna. Om du klickar på uppåt- eller nedåtpilarna ökar eller minskar vinkeln med 5 procentenheter.
• Använd skjutreglaget för att välja placering för din toning eller ange ett numeriskt värde i fältet.
• Du kan ange en specifik färghexkod eller använda färgreglaget för att välja en nyans. Nyligen valda färger visas längst ned i panelen för toningsalternativ.
• Om du vill göra toningen ogenomskinlig kan du använda reglaget till höger för att välja transparens för toningen. Du kan också ange en procentsats i fältet intill hexfärgkoden.

1. Klicka på Spara.

Använd CSS för att ställa in toningar

De flesta CSS background-egenskapsvärden kan användas för att ställa in en bakgrundsfärg. Du kan använda det här fältet för solida färger (till exempel skapar #000000, black, rgb(0,0,0,0), rgba(0,0,0,0), hsl(0, 0%, 0%) och hsla(0, 0%, 0%, 1) en solid svart bakgrund) eller för toningar (till exempel linear-gradient(red, green), radial-gradient(red, green) eller conic-gradient(red, green)). Toningar kan också upprepas.

Steg:

1. Från din Shopify-admin går du till Webbshop > Teman.
2. Klicka på Anpassa bredvid temat du vill anpassa.
3. Klicka på kugghjulsikonen och sedan på Färger.
4. Klicka på ett befintligt schema som du vill redigera i avsnittet Scheman.
5. Klicka på den toning som du vill redigera.
6. Klicka på pilen bredvid Toning och välj sedan CSS.
7. Skriv eller klistra in din toningskod i fältet CSS-kod. Förhandsgranskningen i temaredigeraren visar din toning på rätt plats.
8. Klicka på Spara.

Ta bort en toning

1. Från din Shopify-admin går du till Webbshop > Teman.
2. Klicka på Anpassa bredvid temat du vill anpassa.
3. Klicka på kugghjulsikonen och sedan på Färger.
4. Klicka på ett befintligt schema som du vill redigera i avsnittet Scheman.
5. Klicka på toningen som du vill ta bort.
6. Klicka på Ta bort gradient.
7. Klicka på Spara.