Stilguide
Client-First er et sæt retningslinjer og strategier skabt af Finsweet for at hjælpe dig med at bygge Webflow-hjemmesider.
Strukturklasser
En defineret og fleksibel kernestruktur, som vi kan bruge på alle eller de fleste sider.
Stilarter til overskrifter
Overskriftsklasser, når typografistilen ikke matcher standard-HTML-tagget.
Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud.
Eksempelteksten bruges som en pladsholder. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud.
Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside. Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
Eksempelteksten bruges som en pladsholder. Prøvetekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud. Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
Eksempelteksten bruges som en pladsholder. Prøvetekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud. Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud.
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud. Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud.
Tekstklasser
Tekstklasser, når typografistilen ikke matcher standard-HTML-tagget.
Tekststørrelser
Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt findes på din hjemmeside.
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside.
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt findes på din hjemmeside. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside.
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt findes på din hjemmeside. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside.
Tekststilarter
tekst-stil-strikethrough
tekst-stil-kursiv
tekst-stil-dæmpet
tekst-stil-allcaps
text-style-nowrap
tekst-stil-link
Eksempelteksten bruges som pladsholder.
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside. Eksempeltekst bruges som en pladsholder for rigtig tekst-style-2lines
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside. Eksempeltekst bruges som en pladsholder for rigtig tekst. Prøvetekst bruges som pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside. Eksempeltekst bruges som en pladsholder for rigtig tekst.
Vægtning af tekst
Tekstjusteringer
Farver
Administrer tilbagevendende tekst- og baggrundsfarver.
Farvepalette
Tekstfarver
Baggrundsfarver
Maks. bredder
Brug CSS-egenskaben max-width til at begrænse det indre indhold til en maksimal bredde.
Paddings
Utility spacing system - padding klasser. [padding-retning] + [padding-størrelse].
Retningsklasser
Størrelsesklasser
Margener
Utility spacing system - padding klasser. [margin-retning] + [margin-størrelse].
Retningsklasser
Størrelsesklasser
Ikoner
Ensartede ikonstørrelser. icon-height indstiller ikonernes højde. icon-1x1 indstiller både ikonernes højde og bredde.
Nyttige forsyningssystemer
Utility-klasser, som vi gerne vil bruge i de fleste af vores projekter for at bygge hurtigere.
Webflow-elementer
Oprindelige Webflow-elementer med Client-First-klasser anvendt.
Eksempel på en formular-komponent, der bruger mapper
Overskrift 1
Overskrift 2
Overskrift 3
Overskrift 4
Rubrik 5
Rubrik 6
Prøvetekst med et link bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside. Prøvetekst bruges som en pladsholder for rigtig tekst. Prøvetekst bruges som pladsholder for rigtig tekst. Prøvetekst bruges som pladsholder for rigtig tekst.
- Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
- Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
- Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
- Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
- Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
- Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
Prøvetekst bruges som en pladsholder for rigtig tekst, der normalt er til stede. Eksempeltekst hjælper dig med at forstå, hvordan rigtig tekst kan se ud på din hjemmeside. Eksempeltekst bruges som en pladsholder for rigtig tekst, der normalt er til stede.
