Naturamed
Styleguide
Colors
Primary Palette
BRAND COLOURS
Dark Blue
100
Dark Blue
90
Dark Blue
80
Dark Blue
60
Dark Blue
40
Dark Blue
30
Dark Blue
20
Dark Blue
10
Mint Green
100
Mint Green
90
Mint Green
80
Mint Green
60
Pastel Green
100
Pastel Green
80
Pastel Green
60
Pastel Green
40
Pastel Green
30
Pastel Green
20
Secondary Palette
Accent colors
Peach
100
Baby Blue
100
Typography Palette
Backgrounds
Greenish Grey
Dark
Greenish Grey
Medium
Greenish Grey
Light
White
100
Typography Styles
Headings
Centre médical Naturamed
IBM Plex Sans 68px/110%
Heading 1
IBM Plex Sans 48px/110%
Heading 2
IBM Plex Sans 38px/110%
Heading 3
IBM Plex Sans 32px/120%
Heading 4
IBM Plex Sans 26px/135%
Heading 5
IBM Plex Sans 22px/150%
Heading 6
IBM Plex Sans 18px/130%
Uppercase
IBM Plex Sans 12px/120%
Paragraph
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
IBM Plex Sans 36px/130%
IBM Plex Sans 24px/150%
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
IBM Plex Sans 18px/150%
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
IBM Plex Sans 16px/150%
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
IBM Plex Sans 14px/150%
Quotes & Lists
Quotes
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Quote 1
Default
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Quote 2
Italic
Lists
- Example Item 1
- Example Item 2
- Example Item 3
List Dots
- Example Item 1
- Example Item 2
- Example Item 3
List Numbers
- Example Item 1
- Example Item 2
- Example Item 3
List Letters
Heading 1
Heading 2
Heading 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Heading 4
Heading 5
Heading 6
Block quote
Ordered list
- Item 1
- Item 2
- Item 3
Unordered list
- Item A
- Item B
- Item C
Bold text
Emphasis
Superscript
Subscript
Buttons
Button Primary
Button Dark Background
Shapes
Shapes Sizes
Blur Shape Large
Blur Shape Medium
Blur Shape Small
Shapes Colors
Mint Green 100
Mint Green 60
Mint Green 40
Pastel Green 100
Pastel Green 80
Pastel Green 40
Pastel Green 20
Shapes Dark Background
Blur Shape Large
Blur Shape Medium
Blur Shape Small