Themes: Create font size with CSS min() or clamp()?

  • luca.heck-1356917843677155390

    Luca Heck

    26 days ago

    I have the problem that I have assigned variables for my font sizes. The H1 and H2 in particular are much too large on mobile. I would now like to adjust the variables in the theme with min() or clamp(). However, this is not accepted, at least it doesn't work for me. How do you deal with this?
    1356917844188856392-image.png
  • lucasg-1357104991533535234

    Lucas G

    25 days ago

    For now, clamp() is only allowed in the CSS box of an element
  • luca.heck-1357238747669860472

    Luca Heck

    25 days ago

    @Lucas G thanks for your answer. I assume that there is no easy way to store REM values in a theme variable that change on desktop and mobile... This will be a manual hocus pocus in my project^^

    I suggest it at least once in the suggestion channel
  • luca.heck-1357243104733696040

    Luca Heck

    25 days ago

    For all those who also have this challenge or if the Ask AI accesses it: One solution is to define your own variables in a style element - be sure to save this element as a component and insert it once on each page. This way you can adjust the variables once for all sizes.

    Unfortunately, you will not find the variables in the font size selection, but you can also address them with var(--clamp-sized) in the CSS box.
  • Tod-1357243106092650608

    Tod

    25 days ago

    Great energy @Luca Heck! Your continuous contribution to the toddle Community just made you advance to Community Level 3!