Skip to main content

Getting Started

Need to jazz up some HTML?... Let's go!

normalize.css​

Using normalize.css is optional but strongly recommended to assist with cross-browser consistency.

Copy-paste this stylesheet <link> into your <head> before all other stylesheets to load normalize.css.

index.html
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha512-NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w==" crossorigin="anonymous" referrerpolicy="no-referrer" />

fpss.css​

Copy-paste this stylesheet <link> into your <head> after normalize and before all additional stylesheets to load our CSS

index.html
<link href="https://futureproof-protected-assets.s3.eu-west-2.amazonaws.com/brand-assets/stylesheets/fpss.min.css" rel="stylesheet">
tip

Whilst the fpss stylesheet is publically accessible, the assets such as fonts and shapes are not. To make full use of the sheet, you will need to be running a dev server on any of the following:

http://localhost:8080
http://localhost:3000
http://localhost:6006
caution

For deployment, only the following domains have access:

https://*.getfutureproof.co.uk (official futureproof sites)
https://*.netlify.app (used for staging & preview deploys)
https://*.chromatic.com (used for the futureproof Storybook)