Typography

Menu font (29 Junior Liteweight, 16px): FUND RASING PARTNERSHIPS

H1 font size 107px — Knockout 69 Full Liteweight

H2 font size 97px — Knockout 69 Full Liteweight

H3 font size 70px — Knockout 69 Full Liteweight

H4 font size 47px — Knockout 69 Full Liteweight

H5 font size 32px — Knockout 69 Full Liteweight
H6 font size 28px — Knockout 69 Full Liteweight

P font size 19px — Knockout 69 Full Liteweight. The quick brown fox jumps over the lazy dog.

Sentinel (class .sen-font, 32px) — Italic example text.

📏 Spacing & Typography Cheat Sheet

PX REM (16px base) VW (1280px base)
10px0.625rem0.78vw
15px0.938rem1.17vw
20px1.25rem1.56vw
25px1.563rem1.95vw
30px1.875rem2.34vw
35px2.188rem2.73vw
40px2.5rem3.13vw
45px2.813rem3.52vw
50px3.125rem3.91vw
55px3.438rem4.30vw
60px3.75rem4.69vw
65px4.063rem5.08vw
70px4.375rem5.47vw
75px4.688rem5.86vw
80px5rem6.25vw
85px5.313rem6.64vw
90px5.625rem7.03vw
95px5.938rem7.42vw
100px6.25rem7.81vw
105px6.563rem8.20vw
110px6.875rem8.59vw
115px7.188rem8.98vw
120px7.5rem9.38vw
125px7.813rem9.77vw
130px8.125rem10.16vw
135px8.438rem10.55vw
140px8.75rem10.94vw
145px9.063rem11.33vw
150px9.375rem11.72vw
155px9.688rem12.11vw
160px10rem12.50vw
165px10.313rem12.89vw
170px10.625rem13.28vw
175px10.938rem13.67vw
180px11.25rem14.06vw
185px11.563rem14.45vw
190px11.875rem14.84vw
195px12.188rem15.23vw
200px12.5rem15.63vw

✅ Use rem for typography (consistent scaling).
✅ Use vw for layout spacing (fluid to viewport).
✅ For components (buttons/icons), prefer rem.

Icons (Sprite)

Copy any snippet below into an Oxygen Code Block. Icons inherit text colour.

Social

Facebook
<svg class="icon"><use href="#icon-facebook-icon"></use></svg>
Instagram
<svg class="icon"><use href="#icon-instagram-icon"></use></svg>
LinkedIn
<svg class="icon"><use href="#icon-linkedin-icon"></use></svg>
WhatsApp
<svg class="icon"><use href="#icon-whatsapp-icon"></use></svg>
YouTube
<svg class="icon"><use href="#icon-youtube-icon"></use></svg>

UI

Home
<svg class="icon"><use href="#icon-home-icon"></use></svg>
Search
<svg class="icon"><use href="#icon-search-icon"></use></svg>
Sound
<svg class="icon"><use href="#icon-sound-icon"></use></svg>
Tick
<svg class="icon"><use href="#icon-tick-icon"></use></svg>
Close
<svg class="icon"><use href="#icon-x-close-icon"></use></svg>
X
<svg class="icon"><use href="#icon-x-icon"></use></svg>
Button Arrow
<svg class="icon"><use href="#icon-btn-icon"></use></svg>

Special

Break
<svg class="icon"><use href="#icon-break-icon"></use></svg>
Build
<svg class="icon"><use href="#icon-build-icon"></use></svg>
Improve
<svg class="icon"><use href="#icon-inprove-icon"></use></svg>
Exclamation Start
<svg class="icon"><use href="#icon-exclaimation-start-icon"></use></svg>
Exclamation End
<svg class="icon"><use href="#icon-exclaimation-end-icon"></use></svg>
KFC Red Block
<svg class="icon"><use href="#icon-kfc-red-block-icon"></use></svg>

Colours

#000000 Black
#FFFFFF White
#F7F7F7 Light Grey
#EFE9E0 Cream
#CCCCCC Grey
#666666 Dark Grey
#333333 Charcoal
#E4002B Brand Red
Back to Top
magnifiercross