Knowledgebase

Customize Hexa color skins

Portal Home > Knowledgebase > Hexa > Customization > Customize Hexa color skins

Hexa 5 is using tailwind CSS to manage and generate skins.

Requires Node.JS installed https://nodejs.org/en/download/
  1. Download dev zip. Download `hexa5-dev.zip` and extract `hexa5-dev` folder on local computer. 
  2. Copy template files. Copy `templates` folder from latest hexa5.zip\upload into `hexa5-dev`. PurgeCSS will scan the `templates` folder to remove all unused CSS.
  3. Install NPM packages. Open command line and run `npm install`
  4. Build CSS Skins. Example build commands for "tailwind-core.css", "tailwind-original.css" and "tailwind-city.css".
    "npm run build:core"
    "npm run build:original"
    "npm run build:city"
    Minified skin files will be placed into hexa/assets/css/skins/ and hexa-light/assets/css/skins/ folders.
  5. Custom Skin. Create "tailwind-cucstom.css" (initial values can be copied from existing skins and customized) and run "npm run build:custom". Custom skin can be selected from Hexa Extras general tab.

 

sass, css, custom, hexa

Was this answer helpful?
0 Users Found This Useful 6 Votes

Also Read