Design System

informations générales

Marque

Logo principal

Icon

Logo secondaire

Couleurs

Couleur primaire

#3B3E43

Couleur bois

#3B3E43

Couleur secondaire

#B78E66

Typographie

Titre

H1

H1

H1

PC

Tablette

Mobile

H2

H2

H2

PC

Tablette

Mobile

H3

H3

H3

PC

Tablette

Mobile

Paragraphe

Paragraphe

Paragraphe

Paragraphe

PC

Tablette

Mobile

Rich Block

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

Liens

LinkLinkLink

PC

Tablette

Mobile

Listes

  • List item 1
  • List item 2
  • List item 3

Unordered and ordered lists

#444444

Typographie blanc

H1

PC

Tablette

Mobile

H1

H1

H2

PC

Tablette

Mobile

H2

H2

H3

PC

Tablette

Mobile

H3

H3

Paragraph

Paragraphe

Paragraphe

Paragraphe

PC

Tablette

Mobile

Lists

  • List item 1
  • List item 2
  • List item 3
  • List item 1
  • List item 2
  • List item 3

Images et Photos

Landscape banner

image-landscape-banner with a background image set to "Cover" in 100% wrapper

Landscape

Image Landscape

image-landscape in 100% wrapper

Portrait

Image Portrait

image-portrait in css grid column 1

Square

Image Square

image-square in css grid column 2

Avatar

Image Avatar

image-avatar in 40px wrapper

Composants

Boutons

Bouton 1

btn-primary

Bouton 2

btn-secondary

Label

btn-3

Label

btn-4

Forms

We take Webflow's default styles and style them with Dezin's global styles.

Thank you! Your message has been received!
Oops! Something went wrong. Please fill in the required fields and try again.

Videos

Webflow comes with two main video embed objects. One that just displays the video via a url and another Youtube one that lets you adjust playback and privacy controls.

Video embed

Basic video embed. Just replace the video url and you're good to go.

Video youtube

Youtube video player.

Tabs

We take Webflow's clean, simple tabs and style them with Dezin's global styles.

Tab set

Tab 1 content

Tab 2 content

Tab 3 content