Streaming live at 10am (PST)

How to custom code responsive font size?

hi, for the website im working on i’d love to know if it were possible to implement this code:
font-size: calc(.03273*100vw + 12.72727px);
its a calculation for truely responsive font sizing

just like this site implements font sizing

<style>
body {
  font-size: calc(.03273*100vw + 12.72727px);
}
</style>
3 Likes

Yes bit where do it out that string of code ? In the head , body of in custom code of a div ? And how do it make it target only H1. Thanks alot already

Site Settings > Header Custom Code

<style>
h1 {
  font-size: calc(.03273*100vw + 12.72727px);
}
</style>
1 Like

i dont realy see it affecting anything

edit: it works on the staging site, forgot that custom code doesnt work on preview.

So hoow could i then implement this for normal text or a specific class?

Just change the “h1” tag selector to whatever you want to target instead.

For class names, a . followed by lowercase-hyphenated like this: .my-class-name

For others, see Which characters are valid in CSS class names/selectors?

2 Likes