Customizing Quarto Websites

make your website stand out using Sass & CSS

MEDS
R
Quarto
CSS
Author
Affiliation

Samantha Csik

Master of Environmental Data Science Program @ The Bren School (UCSB) & The National Center for Ecological Analysis and Synthesis

Published

October 10, 2022


slides source code

Abstract

Quarto provides a user-friendly framework for creating your personal website – but adding your own creative touch can help make yours stand out from the rest. In this workshop, we learn how to (a) add a template to our landing page and update the _quarto.yml file to quickly add fun features/update the overall layout of our website, (b) create a stylesheet and define Sass variables to start modifying the overall theme (colors, fonts, etc) of our site, and (c) define CSS rules to make fine-tuned adjustments to our site’s appearance.

Audience

This workshop was originally developed for the Master of Environmental Data Science (MEDS) program, administered by the Bren School of Environmental Science & Management in partnership with the National Center for Ecological Analysis and Synthesis.