How to customize colors and gradients

Learn how to customize colors and gradients

Summary


The Paper theme provides a flexible color selection approach, allowing developers to easily modify and add new colors to the theme.

How to


Here's how you can update and change colors in the Paper theme:

  1. Locate the color selection code: Search for the color selection code in your theme's schema file. The provided code example shows a select element with various color scheme options.

  2. Update or add a new color option: To change an existing color, replace the value of the value attribute with a new Tailwind CSS color class, such as bg-sky-500 for Sky 500. Update the label attribute accordingly, for example, "Sky 500".

    To add a new color option, copy one of the existing options, and modify its value and label attributes to reflect the desired color.

  3. Customize colors for each section: Each section of the Paper theme has its custom color settings. Browse through the schema to find where you can customize colors for specific sections.

Did this answer your question?
😞
😐
😁