Create A Classy Subtheme

Classy is a Drupal Core base theme that adds BEM/SMACSS CSS classes to output, so that component styles can be applied with adjusting the markup.

Creating a Classy subtheme is a great starting place when you understand the naming conventions and want to use them in your project over other techniques. You will be able to build things in Drupal and customize the look and feel by editing CSS.

Create CLASSY_SUBTHEME.info.yml in a custom theme directory. Change the file and path name as necessary.

name: Classy Subtheme
description: Classy based subtheme.
type: theme
core_version_requirement: ^9
base theme: classy

This is all you will need to see the theme available in the list.

Before we enable it, let's add some regions.

regions:
  header: Header
  content: Content
  footer: Footer

And include a global library for styles.

libraries:
 - classy_subtheme/styles

We need to create a CLASSY_SUBTHEME.libraries.yml file.

This just says to load styles.css as a base style.

styles:
  css:
    base:
      styles.css: {}

Now you can enable the theme. Any changes you make to the css file should be applied to the page.