Teemaeditori - Värit - TWICE Commerce

Värien asetuspaneeli teemaeditorissa — Teemaeditori > Värit

Värit-paneeli määrittää väripaletin, jota käytetään verkkokaupan jokaisella sivulla. Muutokset vaikuttavat kaikkialle: kun päivität värin täällä, se päivittyy jokaiseen elementtiin, joka viittaa siihen. Jokainen väri hyväksyy heksadesimaaliarvon (esim. #111826). Avaa värivalitsin napsauttamalla värinäytettä tai kirjoita heksakoodi suoraan.

Tausta

Asetus	Oletus	Kuvaus
Ensisijainen	`#FFFFFF`	Sivun päätausta.
Toissijainen	`#F7F9FA`	Vaihtoehtoiset pinnat, kuten kortit ja sivupaneelit.
Kontrasti	`#111826`	Voimakaskontrastiset pinnat, kuten ylätunniste tai tummat osiot.

Teksti

Asetus	Oletus	Kuvaus
Ensisijainen	`#111826`	Otsikot ja leipäteksti.
Toissijainen	`#374152`	Tukiteksti, nimikkeet ja kuvaukset.
Kontrasti	`#FFFFFF`	Teksti kontrastivärisillä taustoilla.

Reuna

Asetus	Oletus	Kuvaus
Ensisijainen	`#E4E6EB`	Erottimet, korttien reunat ja osioiden väliviivat.
Toissijainen	`#F2F3F5`	Hienovaraiset erottimet ja toissijaiset väliviivat.

Valintaruudut ja valintapainikkeet

Asetus	Oletus	Kuvaus
Väri	`#374152`	Valintaruutujen ja valintapainikkeiden oletusväri (ei valittuna).
Valitun väri	`#111826`	Väri, kun valintaruutu tai valintapainike on valittuna.

Tila

Asetus	Oletus	Kuvaus
Virhe	`#D92D20`	Vahvistusvirheet, loppuunmyynnin ilmaisimet ja muut virhetilat.

CSS-muuttujat

Jokainen väri vastaa CSS-muuttujaa, johon voit viitata mukautetussa CSS:ssä:

:root {
  --storefront-color-background: #FFFFFF;
  --storefront-color-background-secondary: #F7F9FA;
  --storefront-color-background-contrast: #111826;
  --storefront-color-text: #111826;
  --storefront-color-text-secondary: #374152;
  --storefront-color-text-contrast: #FFFFFF;
  --storefront-color-border: #E4E6EB;
  --storefront-color-border-secondary: #F2F3F5;
  --storefront-selection-control-color: #374152;
  --storefront-selection-control-selected-color: #111826;
  --storefront-color-error: #D92D20;
}

Aiheeseen liittyvää

Ylätunnistepalkki

Mukauta ylätunnisteen tausta-, teksti-, kuvake- ja reunavärit.

Typografia

Määritä fonttiperheet ja koot.

Mukautettu CSS

Ohita mikä tahansa tyyli mukautetulla CSS:llä.

Tervetuloa TWICE-dokumentaatioon

Liikkuminen TWICEssä

Järjestelmän ymmärtäminen

Teemaeditori - Värit

Tausta

Teksti

Reuna

Valintaruudut ja valintapainikkeet

Tila

CSS-muuttujat

Aiheeseen liittyvää

Ylätunnistepalkki

Typografia

Mukautettu CSS

​Tausta

​Teksti

​Reuna

​Valintaruudut ja valintapainikkeet

​Tila

​CSS-muuttujat

​Aiheeseen liittyvää

Ylätunnistepalkki

Typografia

Mukautettu CSS

Tausta

Teksti

Reuna

Valintaruudut ja valintapainikkeet

Tila

CSS-muuttujat

Aiheeseen liittyvää