# Utseende og temaer

Tilpass skjemaet ditt med farger, fonter, forhåndsinnstillinger, delte arbeidsområdetemaer, omslagsbilder og mørk modus.

## Utseende og temaer

Farger, fonter, forhåndsinnstillinger, omslagsbilder og mørk modus. Gi hvert skjema en naturlig plass i merkevaren din.

<h2 id="theme-panel">Temapanel</h2>
<p>
  Klikk på <strong>Tema</strong> (palettikon) i den øverste verktøylinjen. Panelet dokkes til høyre og forhåndsviser endringer umiddelbart.
</p>
<p>
  <strong>Modus</strong>-bryteren (Lys/Mørk) øverst i panelet endrer hvilket fargevalg du redigerer. Hver modus lagrer egne temaverdier,
  slik at du kan finjustere begge uavhengig av hverandre.
</p>
<p>
  <strong>Tema</strong>-velgeren under den viser arbeidsområdetemaene dine for den modusen først, og deretter de innebygde
  forhåndsinnstillingene. Bunnteksten viser <strong>Alle endringer lagret</strong> helt til du endrer noe; deretter vises{' '}
  <strong>Forkast</strong> og <strong>Lagre</strong>.
</p>

<h2 id="presets">Forhåndsinnstillinger</h2>
<p>
  Tema-velgeren har sju forhåndsinnstillinger for lys modus og ni for mørk. Hver av dem bruker et fullstendig sett med koordinerte farger,
  en font og hjørnerunding med ett klikk.
</p>
<ul>
  <li>
    <strong>Standard formbase-tema</strong> — brukes automatisk på hvert nye skjema, ett per modus
  </li>
  <li>
    <strong>Forhåndsinnstillinger</strong> — de kurerte temaene listet nedenfor
  </li>
  <li>
    <strong>Egendefinert</strong> — «Bare dette skjemaet». Det velgeren viser så snart du endrer en verdi for hånd
  </li>
</ul>

> ℹ️ **Tilgjengelig på Gratis**
> <p>
>     Egendefinerte temaer, inkludert forhåndsinnstillinger og separat lys/mørk-styling, er tilgjengelig på alle planer. Se{' '}
>     <a href="/no/subscription-billing/plans-pricing">planer og priser</a>.
>   </p>

<h3 id="light-presets">Forhåndsinnstillinger for lys modus</h3>

<h3 id="dark-presets">Forhåndsinnstillinger for mørk modus</h3>

<h2 id="workspace-themes">Arbeidsområdetemaer</h2>
<p>
  Et arbeidsområdetema er et navngitt tema for én modus, lys eller mørk, som flere skjemaer deler. Bruk det til å holde alle skjemaer på
  merkevare: endre temaet én gang, så følger alle skjemaer som bruker det. For å dekke begge moduser, hold to temaer, for eksempel{' '}
  <em>Acme Light</em> og <em>Acme Dark</em>.
</p>

<h3 id="create-workspace-theme">Opprett et arbeidsområdetema</h3>
<ol>
  <li>
    Åpne temapanelet på et skjema, velg Lys eller Mørk, og velg en forhåndsinnstilling eller juster fargene til skjemaet ser riktig ut.
  </li>
  <li>
    Klikk på <strong>Lagre som arbeidsområdetema</strong> under Tema-velgeren, og gi det et navn, for eksempel navnet på bedriften din.
  </li>
</ol>
<p>Denne modusen av skjemaet er nå koblet til det nye temaet. Velgeren viser navnet og hvor mange skjemaer som bruker det.</p>

<h3 id="use-workspace-theme">Bruk det på et annet skjema</h3>
<p>
  Åpne temapanelet på det andre skjemaet, velg temaet under <strong>Arbeidsområdetemaer</strong>, og klikk <strong>Lagre</strong>. Velgeren
  viser bare arbeidsområdetemaer for modusen du redigerer, så koble lys og mørk modus hver for seg.
</p>

<h3 id="edit-workspace-theme">Rediger et koblet skjema</h3>
<p>
  Et koblet skjema redigeres som ethvert annet skjema. Så snart endringene dine avviker fra arbeidsområdetemaet, spør bunnteksten hvor de
  skal lagres:
</p>
<ul>
  <li>
    <strong>Lagre til [temanavn]</strong> oppdaterer arbeidsområdetemaet og alle skjemaer som er koblet til det.
  </li>
  <li>
    <strong>Lagre bare for dette skjemaet</strong> beholder endringen på dette skjemaet. Denne modusen slutter å følge arbeidsområdetemaet
    og blir et egendefinert tema.
  </li>
</ul>
<p>
  Å bruke en forhåndsinnstilling på en koblet modus kobler den også fra. For å koble den til igjen, velg arbeidsområdetemaet fra velgeren og
  lagre.
</p>

> ℹ️ **Publiserte skjemaer oppdateres ved neste publisering**
> <p>
>     Å lagre et arbeidsområdetema endrer utkastet til alle koblede skjemaer med én gang. Respondenter ser det nye utseendet etter at hvert
>     skjema publiseres på nytt, akkurat som med enhver annen endring. Koblede skjemaer viser <strong>Publiser endringer</strong> frem til da.
>   </p>

<h3 id="manage-workspace-themes">Gi nytt navn eller slett</h3>
<p>
  På et koblet skjema, åpne <strong>⋯</strong>-menyen ved siden av Tema-velgeren. <strong>Gi nytt navn</strong> endrer navnet overalt der
  temaet brukes. <strong>Slett</strong> fjerner temaet; skjemaer som brukte det, beholder utseendet sitt som et egendefinert tema.
</p>

<h2 id="theme-sections">Temakontroller</h2>

<p>
  Velg en forhåndsinnstilling eller et arbeidsområdetema, og finjuster deretter typografi og farger. Hver farge beskriver et formål snarere
  enn én komponent. Hvis du for eksempel endrer <strong>Tekst</strong>, oppdateres sidetekst, spørsmålstitler, felttekst og alternativtekst
  samtidig. Hold musepekeren over navnet på en farge for å se hva den styrer. En prikk markerer farger du har endret, men ikke lagret.
</p>

<h3 id="typography">Typografi</h3>

<h3 id="colors">Farger</h3>

<p>Fargene er gruppert etter hvor de vises på skjemaet.</p>

<p>
  Vurdering-gruppen har også <strong>Stjernestørrelse</strong>, størrelsen på vurderingsstjerner i piksler, fra 12 til 48.
</p>

<h2 id="fonts">Fonter</h2>
<p>formbase leveres med elleve skriftfamilier. Fonten du velger under Typografi, gjelder all tekst på skjemaet.</p>

<h2 id="cover-logo">Omslagsbilde og logo</h2>
<p>
  Omslagsbildet og logoen sitter øverst på lerretet. Du setter dem opp direkte på lerretet — ikke inne i temapanelet. For en gjennomgang, se{' '}
  <a href="/no/building-forms/understanding-the-editor#cover-logo">Forstå redigereren → Omslag og logo</a>.
</p>

<h2 id="dark-mode">Mørk modus</h2>
<p>formbase støtter mørk modus to steder: i dashbordet og i publiserte skjemaer.</p>

<h3 id="dark-mode-dashboard">Dashbord</h3>
<p>Slå på mørk modus fra brukermenyen nederst i sidefeltet. Innstillingen følger kontoen din på tvers av enheter.</p>

<h3 id="dark-mode-published">Publiserte skjemaer</h3>
<p>
  Publiserte skjemaer følger respondentens systempreferanse som standard. Hvis enheten deres er i mørk modus, vises skjemaet i mørk modus.
</p>

<h3 id="dark-mode-theming">Temaer for begge moduser</h3>
<p>
  Hvis du bare setter opp et lyst tema, bruker skjemaet formbase sine standard mørke farger når mørk modus er aktiv. For full kontroll, sett
  opp begge fargevalg med lys/mørk-bryteren øverst i temapanelet.
</p>
<p>
  Når du bytter mellom Lys og Mørk i temapanelet, endres dashbordet for å matche. Dette lar deg forhåndsvise temaet ditt i kontekst mens du
  redigerer.
</p>

<h2 id="examples">Vanlige temamønstre</h2>

<ul>
  <li>
    <strong>Matche merkevaren din</strong> — velg merkevarefonten din, sett knappefargen til din primære merkevarefarge, og last opp logoen
    din. Bruk en forhåndsinnstilling som utgangspunkt, og lagre deretter resultatet som et arbeidsområdetema, slik at alle skjemaer deler
    det.
  </li>
  <li>
    <strong>Undersøkelse med mørk modus først</strong> — tving mørk modus via innbyggingsinnstillingene når du deler, og tilpass deretter
    det mørke fargevalget for lesbarhet. Bruk en høykontrast-aksent for den aktive vurderingsfargen slik at stjerner skiller seg ut på mørke
    bakgrunner.
  </li>
  <li>
    <strong>Minimalistisk innbygging</strong> — sett Bakgrunn til å matche nettstedet ditt, skjul omslagsbildet og logoen i
    innbyggingsinnstillingene, bruk en dempet Kant-farge, og reduser hjørnerundingen til 0.
  </li>
  <li>
    <strong>Leken quiz</strong> — velg Comic Sans MS, dra hjørnerundingen mot 32 for pillefasonger, bruk en lys Valgt-farge, og legg til et
    omslagsbilde fra Unsplash-fanen i omslagsvelgeren.
  </li>
</ul>

<h2 id="branding">Merkevarebygging</h2>
<p>
  Som standard viser publiserte skjemaer et lite formbase-merke. Slå det av med <strong>Vis formbase-merking</strong> i{' '}
  <strong>Skjemainnstillinger → Generelt</strong>. Å fjerne merket krever en Pro- eller Business-plan — se{' '}
  <a href="/no/subscription-billing/plans-pricing">planer og priser</a>.
</p>

> 💡 **Test både lys og mørk modus før publisering**
> <p>
>     Forhåndsvis skjemaet med system mørk modus aktivert før publisering. Logokontrast og aksentfarger trenger ofte en justering for den
>     mørke varianten — spesielt omslagsbilder og knappefarger som ser flotte ut på lys bakgrunn, men som vaskes ut på mørk bakgrunn.
>   </p>

<h2 id="next-steps">Neste steg</h2>
<div class="not-prose grid gap-3 sm:grid-cols-2">
  - [Språkinnstilling](/no/building-forms/language-setting) — Tilby skjemaet ditt på et hvilket som helst språk
  - [Filopplastinger og signaturer](/no/building-forms/file-uploads-signatures) — Ta imot dokumenter og e-signaturer
  - [Botbeskyttelse](/no/building-forms/captcha-bot-protection) — Blokker søppelpost med Cloudflare Turnstile
  - [Delingslenker](/no/sharing-publishing/sharing-embedding) — Opprett og administrer delingslenke-URLer
</div>