Rise: Default Font Size

Workaround: Changing Default Font Sizes in Rise Using the user-style.css File

For years, many of us have asked Articulate for the ability to set global default font sizes in Rise instead of manually adjusting text in every block. I recently discovered that the exported course package already contains a file that can be used as a workaround.

This approach lets you change typography across the entire course with one file. I'm looking into how to use the same process to change the color palette. An there are many other settings to be discovered like outlines and more. 

⚠️ One important limitation: this does not change the editing experience inside Rise. You still won’t see the new font sizes while designing the course. The changes only appear after exporting the course. However, it can still save a significant amount of time because you don’t need to manually resize text in every block.

Step 1 — Export Your Course

In Rise, click Export (SCORM or Web works).

Download the ZIP package.

Step 2 — Extract the Package

Right-click the ZIP file and choose:

Extract All

Inside the extracted folder you will see several folders.

Step 3 — Find the CSS Override File

Navigate to: custom/user-style.css

Open this file in a simple text editor (Notepad, TextEdit, etc.).

You will likely see:

/* No custom CSS provided */

This file can be used to add your own style overrides.

Step 4 — Add Your Overrides

Example: Set all body and block text to 18pt

.fr-view p,
.fr-view li,
.lesson p,
.lesson li { font-size: 20pt !important; }

Example: Also force headings to 24pt

.fr-view h1,
.fr-view h2,
.fr-view h3,
.fr-view h4,
.fr-view h5,
.fr-view h6,
.block-text__heading,
.lesson-header__title { font-size: 20pt !important; }

Save the file.

Step 5 — Test the Course

Open: content\index.html

The course will launch in your browser so you can confirm the changes.

Step 6 — Re-zip and Upload

Select all extracted files, zip them again, and upload the new ZIP to your LMS.

Useful Classes You May Want to Customize

These classes control most of the visible text in Rise.

.fr-view
(Main container used by the Rise text editor.)

Controls:

• paragraphs

• lists

• headings

• most block text

Example:

.fr-view p { font-size: 20pt; }

.block-text__heading

Heading for text blocks (section titles).

Example:

.block-text__heading { font-size: 24pt; }

.lesson-header__title

The large lesson title at the top of a lesson.

Example:

.lesson-header__title { font-size: 32pt; }

.lesson

Main container for lesson content.

Useful for global adjustments.

Example:

.lesson { line-height: 1.6; }

.nav-sidebar

Controls the course navigation sidebar.

Example:

.nav-sidebar { font-size: 14px; }

Helpful Tip

If you want to explore more classes in your course, open the course in your browser and press F12 → Inspect. This allows you to see the HTML structure and identify selectors used by different blocks.

Important Note

When you export the course again from Rise, the package is rebuilt, so you will need to copy your custom CSS into the new export.

My team plans to keep a standard user-style.css file and reuse it across courses for WCAG compliance. We may even create one for each client.