We take care of your water birth.

Shopping cart

No products in the basket.

Birthpools
Design System

Design, develop, deliver. Use Birthpool's end-to-end design language to create simple, intuitive, and beautiful experiences.

Colours

Use colours purposefully to communicate how things function in the interface. This helps us create visual patterns that can make interacting with our product easier and more predictable for merchants.

Colour palette

Our colour palette is built with our core principles and guidelines as its foundation.
Lighter
#FFFFFF
Light
#F8FAFA
Cultured
#F3F6F7
Dark
#DEE6E9
Darker
#C9D6DB
Lightest
#A2AAB9
Lighter
#2C313A
Light
#1A1D23
Rich Black
#090A0C
Lighter
#1AF0FF
Light
#00DBEB
Pacific Blue
#00ADBB
Dark
#0097A2
Darker
#007E87
Lighter
#ED45A7
Light
#DF168B
Jazzberry
#C6147D
Dark
#A71168
Darker
#820D51
Lighter
#2B5D8C
Light
#22496D
Prussian Blue
#18344F
Dark
#132A3E
Darker
#0A151F

Typography

The styles defined in the typographic scale are the primary way to communicate visual hierarchy in text. We use following two Google Fonts for our text (Roboto) and headings (Dosis).

Heading

Birthpools Heading H1

font-size: 48px;
line-height: 1.8;
font-weight: 400;
color: #132A3E (Prussian Blue Dark)

Birthpools Heading H2

font-size: 36px;
line-height: 1.6;
font-weight: 400;
color: #132A3E (Prussian Blue Dark)

Birthpools Heading H3

font-size: 28px;
line-height: 1.6;
font-weight: 400;
color: #132A3E (Prussian Blue Dark)

Birthpools Heading H4

font-size: 24px;
line-height: 1.6;
font-weight: 400;
color: #132A3E (Prussian Blue Dark)

Birthpools Heading H5

font-size: 20px;
line-height: 1.6;
font-weight: 500;
color: #132A3E (Prussian Blue Dark)

Birthpools Heading H6

font-size: 18px;
line-height: 1.6;
font-weight: 500;
color: #132A3E (Prussian Blue Dark)

Text

Body Text Normal

font-size: 16px;
line-height: 1.6;
font-weight: 400;
color: #2C313A (Rich Black Lighter)

 

Body Text Large

font-size: 18px;
line-height: 1.6;
font-weight: 400;
color: #2C313A (Rich Black Lighter)

 

Logo & Icon

We make us of 2 different logo's a favicon and an icon for social media use. Do you need these logo's and icons in high resolution or vector file? Send an email to design@www.birthpools.com

Logo

Birthpools logo

Used for online and print

Favicon

Used as favicon for our websites

Icon

The icon is used for our social media accounts like: Instagram, Facebook and LinkedIn.

Bevallingsbaden

Logo

Used for website and print
Bevallingsbaden logo

Spacing

Consistent spacing creates visual balance that makes the user interface (UI) easier for merchants to scan. Apply consistent spacing to improve the quality of the UI.
2px
4px
8px
16px
32px
64px
For our dutch website we use a different logo and domain name (bevallingsbaden.nl). The favicon and icon are the same as Birthpools

Birthpools logos on Rich Black or Pacific Blue 

For use of logos on Rich Black or Pacific Blue  we use a white logo. Right click to download high res logos.
Copyright © 2015 – 2023 Birthpools B.V. All Rights Reserved
Visit our FacebookVisit our InstagramVisit our LinkedInVisit our YouTube channel
chevron-down
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram