Let's look at the folder structure that comes with each theme:
theme/ ├── assets/ ├── settings/ ├── templates/ ├── manifest.json ├── script.js └── style.css
assets/ folder contains all custom files such as scripts, images, fonts, etc. You can add and use your own theme assets by adding files to
assets/ folder. There are several allowable file types for themes; see Allowable file types for theme assets.
settings/ folder contains images associated with settings and variables described in the
manifest.json file. The names of images must match the variable identifiers.
templates/ folder contains all editable page templates for each page type, such as home, category, and section, as well as the global header and footer. Templates are written in Curlybars, Zendesk’s templating language.
The file defines the Settings panel of the theme in Guide. It allows changing the theme options without touching the code. The properties you set in your manifest file for colors, fonts, and theme images are stored in variables. You can use these variables in the theme's
style.css file. You can also reference the variables using Curlybars expressions in HTML page templates. You can use it to add or edit theme settings.
style.css file contains the main styles for your theme. Instead of hard-coded values, we use CSS custom properties (variables) that are supported in all modern browsers.