# Sizing
> Wave supports two sizes: "medium" and "small". A project should be on one size and stick to that size in all integrated components.

![Size](https://next.wave-design-system.pages.dev/_next/static/chunks/images/sizeIntro-2d3a6fd2e2de4f3c2e84995f55c2c5fb.png)

Medium size components go along with a base font size of your project of <b>16px</b>.<br />
Small size components go along with a base font size of your project of <b>14px</b>.

## When to use which size

The medium size is recommended for:

- map based products
- infrastructure products
- products that do not have too much data
- mobile products
- products used on touch devices

The small size is recommend for:

- product with a high data density
- any trading, insight and energy products

### Use medium for mobile devices

Please note: It is possible to switch the size depending on the screen resolution of the user. This is for example recommended to use to switch a medium sized project to small in order to optimise for smaller laptop screens. But for mobile devices (that might also have a smaller resolution) it is highly recommended to use the medium size components! This is due to the fact, that touch interaction requires a certain size of controls.

## Do not mix components of different sizes

![do not mix sizes](https://next.wave-design-system.pages.dev/_next/static/chunks/images/sizeMixSizes-30e173635dee8441cc3345a11eaed6cb.png)

You should never mix components of different sizes!<br />
It is important to keep a calm and consistent design which is heavily influenced by consistent sizing.