Crema React
v-1
v-1
  • About Crema(CRA)
  • Product Overview
  • Folder Structure
  • Installation
    • Pre-Requisites
    • Installing Crema
  • Default Route
  • Customization
    • Template Style
    • Template Mode
    • Template and Sidebar Color
    • Tempate Direction
    • Navigation Style
    • Footer
    • Footer Type
    • Route Transition
  • Multi-Lingual Support
    • Changing Language
    • Adding New Language
  • Sidebar Menu
    • Adding New Menu
  • Route Protection
  • Loggedin User
  • Axios Setup
  • Package.json
  • GitHub Access
  • Slack Community
  • FAQ
  • CRA-SSR
    • About CRA+SSR
    • Installation
    • Folder Structure
    • Route Protection
    • Deploy to server
  • Next.js
    • About Next.JS
    • Installation
    • Folder Structure
    • Deploy to server
  • Next.Js + TypeScript
    • About Next.js + Typescript
    • Installation
    • Folder Structure
    • Deploy to server
  • CRA + TypeScript
    • About CRA + TypeScript
  • Tailwind CSS
    • About Tailwind CSS
  • Styled Component
    • About Styled Component
  • Servers
    • Python
    • Mongoose
    • Laravel
Powered by GitBook
On this page

Was this helpful?

  1. Customization

Template and Sidebar Color

Last updated 5 years ago

Was this helpful?

Users can customize the template color and sidebar color according to their choice and requirements. Thousands of color combinations can be made by using the color customizer option. We have provided some primary and secondary color combinations and also provided the customizer option to make your own.

Changing Template Color in run time:-

Click on the Settings button on the right corner of the screen just below the notification icon, a drawer will open in which you will find color option and from there, you can choose from PRESET color combinations or create your own by selecting the CUSTOM option.

Changing Template Color and Sidebar Color in development mode (setting default Template Color and Sidebar Color):-

To set the default Template Color and Sidebar Color, go to the following file:-

src/@crema/utility/ContextProvider/defaultConfig.js

In this file, you will find an object type property named 'theme' which has a 'palette' object and in that, you can define the primary, secondary and other colors.

A screenshot is attached for the reference.