Prepare repository for merge

This commit is contained in:
Angelos Chalaris
2023-05-01 22:51:44 +03:00
parent 334b4dd6f8
commit e49fc829dd
100 changed files with 0 additions and 593 deletions

View File

@ -0,0 +1,23 @@
---
title: Fluid typography
type: snippet
tags: [visual]
author: chalarangelo
cover: shell-focus
dateModified: 2021-05-16T11:23:05+03:00
---
Creates text that scales according to the viewport width.
- Use the `clamp()` CSS function to clamp the value of `font-size` between `1rem` and `3rem`.
- Use the formula `8vw - 2rem` to calculate a responsive value for `font-size` (`1rem` at `600px`, `3rem` at `1000px`).
```html
<p class="fluid-type">Hello World!</p>
```
```css
.fluid-type {
font-size: clamp(1rem, 8vw - 2rem, 3rem);
}
```