Typography
Headlines
The font for headlines is Poppins
Class
Size
Line height
Sample
is-h1
110px
140px
LorIpsum
LorIpsum
is-h2
64px
80px
Lorem Ipum
is-h3
28px
36px
Lorem Ipsum
is-h4
22px
32px
Lorem Ipsum
Body copy
The font for the body copy is Poppins.
Class
Size
Line height
Sample
is-txt-xlarge
32px
40px
Lorem Ipsum
is-txt-large
26px
40px
Lorem Ipsum
is-txt-medium
20px
28px
Lorem Ipsum
is-txt-small
14px
24px
Lorem Ipsum
Typography helper classes
Class
What it does
is-txt-italic
Makes the text italic
is-txt-bold
Makes the text bold
is-txt-semibold
Makes the text semi bold
is-txt-weight-medium
Makes the text semi bold
is-txt-normal
Makes the text normal
is-txt-underlined
Makes the text underlined
is-txt-allcaps
Capitalizes all letters
is-txt-align-left
Aligns the text to the left
is-txt-align-center
Aligns the text to the center
is-txt-align-center
Aligns the text to the right
is-txt-align-right
Aligns the text to the right
is-txt-align-right
Makes the text bold
is-text-link
Styles the inline text link
Buttons
Class
Sample
Button
Button helper classes
Class
What it does
is-btn-d-fw
The buttons width becomes 100% of its parent on desktop
is-btn-t-fw
The buttons width becomes 100% of its parent on tablet
is-btn-l-fw
The buttons width becomes 100% of its parent on mobile landscape
is-btn-p-fw
The buttons width becomes 100% of its parent on mobile portrait
Grids
grid--6-6
grid--8-4
grid--4-8
grid--4-4-4
grid--3-3-3-3
grid--2-2-2-2-2
Icons & Pictos & Others
Spacing system
Margins
Top
Bottom
Top and bottom
Rem
Px
Sample
is-margin-t-4
is-margin-b-4
is-margin-tb-4
0.25rem
4px
is-margin-t-8
is-margin-b-8
is-margin-tb-8
0.5rem
8px
is-margin-t-12
is-margin-b-12
is-margin-tb-12
0.5rem
12px
is-margin-t-16
is-margin-b-16
is-margin-tb-16
1rem
16px
is-margin-t-24
is-margin-b-24
is-margin-tb-24
1.5rem
24px
is-margin-t-32
is-margin-b-32
is-margin-tb-32
2rem
32px
is-margin-t-40
is-margin-b-40
is-margin-tb-40
2.5rem
40px
is-margin-t-48
is-margin-b-48
is-margin-tb-48
3rem
48px
is-margin-t-56
is-margin-b-56
is-margin-tb-56
3.5rem
56px
is-margin-t-64
is-margin-b-64
is-margin-tb-64
4rem
64px
is-margin-t-72
is-margin-b-72
is-margin-tb-72
4.5rem
72px
is-margin-t-80
is-margin-b-80
is-margin-tb-80
5rem
80px
is-margin-t-88
is-margin-b-88
is-margin-tb-88
5.5rem
88px
is-margin-t-96
is-margin-b-96
is-margin-tb-96
6rem
96px
is-margin-t-104
is-margin-b-104
is-margin-tb-104
6.5rem
104px
Paddings Top Bottom
Top
Bottom
Top and bottom
Rem
Px
Sample
is-pad-t-4
is-pad-b-4
is-pad-tb-4
0.25rem
4px
is-pad-t-8
is-pad-b-8
is-pad-tb-8
0.5rem
8px
is-pad-t-16
is-pad-b-16
is-pad-tb-16
1rem
16px
is-pad-t-24
is-pad-b-24
is-pad-tb-24
1.5rem
24px
is-pad-t-32
is-pad-b-32
is-pad-tb-32
2rem
32px
is-pad-t-40
is-pad-b-40
is-pad-tb-40
2.5rem
40px
is-pad-t-48
is-pad-b-48
is-pad-tb-48
3rem
48px
is-pad-t-56
is-pad-b-56
is-pad-tb-56
3.5rem
56px
is-pad-t-64
is-pad-b-64
is-pad-tb-64
4rem
64px
is-pad-t-72
is-pad-b-72
is-pad-tb-72
4.5rem
72px
is-pad-t-80
is-pad-b-80
is-pad-tb-80
5rem
80px
is-pad-t-88
is-pad-b-88
is-pad-tb-88
5.5rem
88px
is-pad-t-96
is-pad-b-96
is-pad-tb-96
6rem
96px
is-pad-t-104
is-pad-b-104
is-pad-tb-104
6.5rem
104px
is-pad-t-112
is-pad-b-112
is-pad-tb-112
7erm
112px
is-pad-t-120
is-pad-b-120
is-pad-tb-120
7.5rem
120px
is-pad-t-128
is-pad-b-128
is-pad-tb-128
8rem
128px
Paddings Top Bottom Left Right
is-pad-tblr-8
is-pad-tblr-16
is-pad-tblr-24
is-pad-tblr-32
is-pad-tblr-40
is-pad-tblr-48
Misc helpers
Flex helpers
Class
What it does
wrap-flex-vert-c
Applied to a parent div it becomes display flex and vertical centered
wrap-flex-vert-c
Applied to a parent div it becomes display flex and vertical centered
wrap-flex-hor-c
Applied to a parent div it becomes display flex and horizontal centered
wrap-flex-right-c
Applied to a parent div it becomes display flex and horizontal centered
wrap-flex-vert-c
wrap-flex-left-c
Applied to a parent div it becomes display flex and horizontal centered
wrap-flex-vert-c
wrap-flex-hor-c
Applied to a parent div it becomes display flex and vertical centered
Show and hide
Class
What it does
is-d-visible
Is displayed on desktop
is-d-visible
Is displayed on desktop
is-d-hidden
Is hidden on desktop
is-d-hidden
Is hidden on desktop
is-t-visible
Is displayed from tablet and down
is-t-visible
Is displayed from tablet and down
is-t-hidden
Is hidden from tablet and down
is-t-hidden
Is hidden from tablet and down
is-l-visible
Is displayed from landscape mobile and down
is-l-visible
Is displayed from landscape mobile and down
is-l-hidden
Is hidden from landscape mobile and down
is-l-hidden
Is hidden from landscape mobile and down
is-p-visible
Is displayed from portrait mobile and down
is-p-visible
Is displayed from portrait mobile and down
is-p-hidden
Is hidden from landscape mobile and down
is-p-hidden
Is hidden from landscape mobile and down
Interective reusable elements
If your domain already has an SPF record, please check with your IT and/or provider to see where the problem comes from.
Only 1 SPF should be created per domain. Deleting an existing SPF can disconnect other tools that require it.
TYPE
TXT
HOST NAME
@
VALUE
v=spf1 include:_spf.[tool-domain] include:_spf.[tool-domain] ~all
TYPE
TXT
HOST NAME
@
VALUE
v=spf1 include:spfnclude:_sall
TYPE
HOST NAME
VALUE
PRIORITY
MX
ASPMX.L.GOOGLE.COM
ASPMX.L.GOOGLE.COM
1
MX
ALT1.ASPMX.L.GOOGLE.COM
ALT1.ASPMX.L.GOOGLE.COM
5
MX
ALT2.ASPMX.L.GOOGLE.COM
ALT2.ASPMX.L.GOOGLE.COM
5
MX
ALT3.ASPMX.L.GOOGLE.COM
ALT3.ASPMX.L.GOOGLE.COM
10
MX
ALT4.ASPMX.L.GOOGLE.COM
ALT4.ASPMX.L.GOOGLE.COM
10
TYPE
TXT
HOST NAME
@
VALUE
v=spf1 include:_spf.[tool-domain] include:_spf.[tool-domain] ~all
If your domain already has an SPF record, please check with your IT and/or provider to see where the problem comes from.
Warmy
lemwarm
Automatic email warm-up
square-check
square-check
Deliverability score
square-check
square-check
Reporting dashboard
square-check
square-check
Technical setup check
square-check
square-check
Warm up your real templates
square-check
(from $189/month)
square-check
(from $49/month)
Choose topic of warm-up emails
square-check
square-check
Warm-up network tailored to your niche
square-xmark
square-check
Custom deliverability alerts & tips
square-xmark
square-check
Actual classes (margins)
is-margin-t-4
is-margin-b-4
is-margin-tb-4
is-margin-t-8
is-margin-b-8
is-margin-tb-8
is-margin-t-12
is-margin-b-12
is-margin-t-16
is-margin-b-16
is-margin-tb-16
is-margin-t-24
is-margin-b-24
is-margin-tb-24
is-margin-t-32
is-margin-b-32
is-margin-tb-32
is-margin-t-40
is-margin-b-40
is-margin-tb-40
is-margin-t-48
is-margin-b-48
is-margin-tb-48
is-margin-t-56
is-margin-b-56
is-margin-tb-56
is-margin-t-64
is-margin-b-64
is-margin-tb-64
is-margin-t-72
is-margin-b-72
is-margin-tb-72
is-margin-t-80
is-margin-b-80
is-margin-tb-80
is-margin-t-88
is-margin-b-88
is-margin-tb-88
is-margin-t-96
is-margin-b-96
is-margin-tb-96
is-margin-t-104
is-margin-b-104
is-margin-tb-104
is-margin-t-112
is-margin-b-112
is-margin-tb-112
is-margin-t-120
is-margin-b-120
is-margin-tb-120
is-margin-t-128
is-margin-b-128
is-margin-tb-128
is-margin-t-136
is-margin-b-136
is-margin-tb-136
is-margin-t-144
is-margin-b-144
is-margin-tb-144
is-margin-t-152
is-margin-b-152
is-margin-tb-152
is-margin-t-160
is-margin-b-160
is-margin-tb-160
is-margin-t-168
is-margin-b-168
is-margin-tb-168
is-margin-t-176
is-margin-b-176
is-margin-tb-176
is-margin-t-184
is-margin-b-184
is-margin-tb-184
is-margin-t-192
is-margin-b-192
is-margin-tb-192
is-margin-t-200
is-margin-b-200
is-margin-tb-200
is-margin-t-208
is-margin-b-208
is-margin-tb-208
is-margin-t-216
is-margin-b-216
is-margin-tb-216
is-margin-t-224
is-margin-b-224
is-margin-tb-224
is-margin-t-232
is-margin-b-232
is-margin-tb-232
is-margin-t-240
is-margin-b-240
is-margin-tb-240
is-margin-t-248
is-margin-b-248
is-margin-tb-248
is-margin-t-256
is-margin-b-256
is-margin-tb-256
Actual classes (paddings)
is-pad-t-4
is-pad-b-4
is-pad-tb-4
is-pad-t-8
is-pad-b-8
is-pad-tb-8
is-pad-t-16
is-pad-b-16
is-pad-tb-16
is-pad-t-24
is-pad-b-24
is-pad-tb-24
is-pad-t-32
is-pad-b-32
is-pad-tb-32
is-pad-t-40
is-pad-b-40
is-pad-tb-40
is-pad-t-48
is-pad-b-48
is-pad-tb-48
is-pad-t-56
is-pad-b-56
is-pad-tb-56
is-pad-t-64
is-pad-b-64
is-pad-tb-64
is-pad-t-72
is-pad-b-72
is-pad-tb-72
is-pad-t-80
is-pad-b-80
is-pad-tb-80
is-pad-t-88
is-pad-b-88
is-pad-tb-88
is-pad-t-96
is-pad-b-96
is-pad-tb-96
is-pad-t-104
is-pad-b-104
is-pad-tb-104
is-pad-t-112
is-pad-b-112
is-pad-tb-112
is-pad-t-120
is-pad-b-120
is-pad-tb-120
is-pad-t-128
is-pad-b-128
is-pad-tb-128
is-pad-t-136
is-pad-b-136
is-pad-tb-136
is-pad-t-144
is-pad-b-144
is-pad-tb-144
is-pad-t-152
is-pad-b-152
is-pad-tb-152
is-pad-t-160
is-pad-b-160
is-pad-tb-160
is-pad-t-168
is-pad-b-168
is-pad-tb-168
is-pad-t-176
is-pad-b-176
is-pad-tb-176
is-pad-t-184
is-pad-b-184
is-pad-tb-184
is-pad-t-192
is-pad-b-192
is-pad-tb-192
is-pad-t-200
is-pad-b-200
is-pad-tb-200
is-pad-t-208
is-pad-b-208
is-pad-tb-208
is-pad-t-216
is-pad-b-216
is-pad-tb-216
is-pad-t-224
is-pad-b-224
is-pad-tb-224
is-pad-t-232
is-pad-b-232
is-pad-tb-232
is-pad-t-240
is-pad-b-240
is-pad-tb-240
is-pad-t-248
is-pad-b-248
is-pad-tb-248
is-pad-t-256
is-pad-b-256
is-pad-tb-256