Styling
There are many ways to style your website. They can roughly be grouped into three styling approaches:
- Global CSS Files: the traditional way to style a website. CSS rules are declared globally and styles are applied depending on specificity and inheritance.
- Modular Stylesheets: CSS rules are written traditionally but consumed with JavaScript and scoped locally to avoid unintended side-effects elsewhere. Works out-of-the-box with Gatsby.
- CSS-in-JS: locally-scoped CSS written and consumed in JavaScript, enabling the easier use of dynamic styling and other features. Requires the use of third-party libraries.
Gatsby doesn’t have an opinion about which styling approach you choose. Almost every possible option is supported through official and community plugins. (If there isn’t a plugin yet for your favorite option, consider contributing one!)