import imgSizeSystem from './images/size-system.jpg';

<Meta title='1.Docs|05-Size System'/>

# Size System
We handle the hierarchy of sizes with T-Shirt sizes. So you need a small shirt? Let's call it small. 

<img src={imgSizeSystem} />

````
// Breakpoints
$layout-breakpoint-s: 480px;
$layout-breakpoint-m: 600px;
$layout-breakpoint-l: 760px;

// Font Sizes
$font-size-xl: 4rem;
$font-size-l: 3.2rem;
$font-size-m: 2.4rem;
````