jekyll Sass/SCSS


By default, all your .scss partials go in the <source>/_sass folder.


body {
  margin: 0;

Your main .css or .scss files go in the <source>/css folder. Note: the two first two lines of triple dashes are necessary in order for Jekyll to transpile your .scss file to .css.



@import "base";

div {
  color: #000;

A transpiled .css file will then appear in _site/css/ when you build your site:


body {
  margin: 0 }
div {
  color: #000 }

The css file can be referenced by your .html files like so:


<!DOCTYPE html>

<link rel="stylesheet" href="/css/main.css">