SCSS Assets

Assets can be placed in one of two places, public, or app/assets. Assets in the public folder are served as is, while assets in the app/assets folder are precompiled. Most assets we write are going to be precompiled; for example, SCSS files are compiled into CSS.

SCSS Files

To define a site-wide font styling in a CSS file, create a _layout.scss file which defines CSS properties such as color, font-size, and text alignment.


h1 {
    font-family: 'Montserrat';
    font-size: 32px;
    text-align: center;

And import this into the SCSS entry point,


@import "_layout";

Finally, import application.scss into the html.erb file which is added to each HTML page.


  <%= stylesheet_link_tag 'application' %>