Discourse users can select from 4 different text sizes in their user settings, by default these are:

      Smaller: 14px Normal: 15px
      (default)
      Larger: 17px Largest: 19px
    

If you'd like to increase the font size of your entire Discourse community, you can override the font-size of the HTML element. You can also provide different font sizes for the user text size settings defined above. The example below increases all text size options by 1px.

      html {
      font-size: 16px;
      // default font-size 
      &.text-size-smaller {
      font-size: 15px; } &.text-size-larger
      {
      font-size: 18px; } &.text-size-largest
      {
      font-size: 20px; } }
    

If you want to scale the fonts of a specific element, you can use Discourse's font scaling variables. Using the variable system ensures you're using a consistent set of font-sizes throughout your community.

Changing the font-size of a parent element will proportionately scale the font sizes of all its children.

      .parent {
      font-size: var(--font-up-3);
      // Increases the relative font-size of this element and its children
        by 3 steps in the scale
      .child {
      // If this is set to var(--font-down-3) in Discourse's default CSS,
        the parent font-size increase above would make this equivalent to
        var(--font-0) (var(--font-down-3) + var(--font-up-3) = var(--font-0))
      } }