Atmos
  • Getting Started
  • Build System
    • Gulp
      • Gulp 4
    • Page Structure
    • Sass Modules
  • UI Elements
    • Colors
    • Buttons
    • Icons
    • Cards
    • Alerts
    • Modals
    • Avatar
    • Tables
    • Mail Templates
  • forms
    • Form Layouts
    • Switch
    • Tag Input
    • Radio Box
    • Select2
    • Datepickers
    • Masked Input
    • Rangeslider
    • Dropzone Fileupload
    • Form Wizard
    • Form Validation
  • Charts
    • Charts
    • Apex Charts
    • Chartjs
    • Google Charts
    • Chartist
  • Maps
    • Google Maps
    • Vector Maps
  • Starter Template
    • blank template Markup
Powered by GitBook
On this page
  • Site Colors
  • Gray Shades
  • Chart Colors
  1. UI Elements

Colors

PreviousSass ModulesNextButtons

Last updated 6 years ago

Site Colors

Every color used throughout the theme has been generated by using color variables defined at _variables.scss . you can customize the colors by changing the values of variables.

Gray Shades

Chart Colors

Atmos comes with preselected chart colors

 window.colors = [
        "#687ae8",
        "#12bfbb",
        "#ffb058",
        "#2991cf",
        "#87b8d4",
        "#109693",
        "#f29494",
        "#527cf9",
        "#7140d1",
        "#e79e4e",
        "#52b4ee",
        "#6ed7e0",
        "#8fa6b4",
        "#ffcfcf",
        "#28304e",
        "#95aac9",
        "#f2545b",
        "#f7bc06",
        "#00cc99",
        "#19b5fe",
        "#E3EBF6"
    ];

Chart colors are stored in color array in atmos.js file located in assets/js folder

site colors
gray colors from gray-100 to gray-900