Responsive font size

Responsive font-size

/* please refer to https://developer.mozilla.org/fr/docs/Web/CSS/clamp() */
font-size: clamp(40px, 10vw, 70px); /* clamp(MIN, VAL, MAX) */

Responsive text css

/* Uses vh and vm with calc */
@media screen and (min-width: 25em){
  html { font-size: calc( 16px + (24 - 16) * (100vw - 400px) / (800 - 400) ); }
}

/* Safari <8 and IE <11 */
@media screen and (min-width: 25em){
  html { font-size: calc( 16px + (24 - 16) * (100vw - 400px) / (800 - 400) ); }
}

@media screen and (min-width: 50em){
html { font-size: calc( 16px + (24 - 16) * (100vw - 400px) / (800 - 400) ); }
}

Responsive font size

div {
  font-size: clamp(16px, 3vw, 32px);
}

Source: stackoverflow.com

How to make fonts respnsive

h1 {
  font-size: clamp(16px, 5vw, 34px);
}

Responsive text

body {
  font-size: calc([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width]) / ([maximum viewport width] - [minimum viewport width])));
}

Source: css-tricks.com

Similar codes

0 vote341 views1 answer
Css efeito negativo fotos
CSS
6 votes305 views2 answers
You have a flexbox container with items set in a row. You want the items to be displayed in the opposite order in which they appear currently. Which code do you use?
CSS
19 votes320 views4 answers
Add blur background css
CSS
0 vote314 views1 answer
Add css file through jquery
CSS
1 vote315 views3 answers
How to add link click script in url
CSS
24 votes332 views5 answers
Placeholder css
CSS
0 vote318 views1 answer
How to build a glass website using HTML and CSS
CSS
1 vote318 views1 answer
How to write if condition in css
CSS
0 vote368 views1 answer
Bulma modal
CSS Bulma
0 vote304 views1 answer
Npm ERR! 404 Not Found - GET https://registry.npmjs.org/taiwindcss - Not found
CSS