Color Admin

- 5
  NOTIFICATIONS (5)

  ###### Server Error Reports

  3 minutes ago

  ###### John Smith

  Quisque pulvinar tellus sit amet sem scelerisque tincidunt.

  25 minutes ago

  ###### Olivia

  Quisque pulvinar tellus sit amet sem scelerisque tincidunt.

  35 minutes ago

  ###### New User Registered

  1 hour ago

  ###### New Email From John

  2 hour ago
  View more
- Adam Schwartz
  Edit Profile 2 Inbox Calendar Setting
  Log Out

- Sean Ngu Front end developer
- - Settings
  - Send Feedback
  - Helps

- Navigation
- Dashboard
  - Dashboard v1
  - Dashboard v2
  - Dashboard v3
- 10 Email
  - Inbox
  - Compose
  - Detail
- Widgets NEW
- UI Elements NEW
  - General
  - Typography
  - Tabs & Accordions
  - Unlimited Nav Tabs
  - Modal & Notification
  - Widget Boxes
  - Media Object
  - Buttons
  - Icons
  - Simple Line Icons
  - Ionicons
  - Tree View
  - Language Bar & Icon
  - Social Buttons
  - Intro JS
- Bootstrap 4 NEW
- Form Stuff NEW
  - Form Elements
  - Form Plugins
  - Form Slider + Switcher
  - Form Validation
  - Wizards
  - Wizards + Validation
  - WYSIWYG
  - X-Editable
  - Multiple File Upload
  - Summernote
  - Dropzone
- Tables
  - Basic Tables
  - Managed Tables
    - Default
    - Autofill
    - Buttons
    - ColReorder
    - Fixed Column
    - Fixed Header
    - KeyTable
    - Responsive
    - RowReorder
    - Scroller
    - Select
    - Extension Combination
- Front End
  - One Page Parallax
  - Blog
  - Forum
  - E-Commerce
- Email Template
  - System Template
  - Newsletter Template
- Chart NEW
  - Flot Chart
  - Morris Chart
  - Chart JS
  - d3 Chart
  - Apex Chart
- Calendar
- Map
  - Vector Map
  - Google Map
- Gallery
  - Gallery v1
  - Gallery v2
- Page Options
  - Blank Page
  - Page with Footer
  - Page without Sidebar
  - Page with Right Sidebar
  - Page with Minified Sidebar
  - Page with Two Sidebar
  - Page with Line Icons
  - Page with FontAwesome
  - Full Height Content
  - Page with Wide Sidebar
  - Page with Light Sidebar
  - Page with Mega Menu
  - Page with Top Menu
  - Page with Boxed Layout
  - Page with Mixed Menu
  - Boxed Layout with Mixed Menu
  - Page with Transparent Sidebar
- Extra
  - Timeline
  - Coming Soon Page
  - Search Results
  - Invoice
  - 404 Error Page
  - Profile Page
- Login & Register
  - Login
  - Login v2
  - Login v3
  - Register v3
- Version NEW
  - HTML
  - AJAX
  - ANGULAR JS
  - ANGULAR JS 8
  - LARAVEL
  - VUE JS
  - REACT JS
  - MATERIAL DESIGN
  - APPLE DESIGN
  - TRANSPARENT DESIGN
  - FACEBOOK DESIGN
- Helper
  - Predefined CSS Classes
- Menu Level
  - Menu 1.1
    - Menu 2.1
      - Menu 3.1
      - Menu 3.2
    - Menu 2.2
    - Menu 2.3
  - Menu 1.2
  - Menu 1.3
- Collapse

1. Home
2. CSS Helper
3. Predefined CSS Class

# Predefined CSS Class header small text goes here...

- General
- Width & Height
- Text & Font
- Margin
- Padding
- Background Color
- Text Color

#### General CSS Class

All the predefined css classes will override the defined css styling in your classes, UNLESS the `!important` is declared in your defined css styling.

Row Space | Table | Float | Border Radius | Vertical Box | Overflow
--- | --- | --- | --- | --- | ---
.row.row-space-0
.row.row-space-2
.row.row-space-4
.row.row-space-6
.row.row-space-8
.row.row-space-10
.row.row-space-12
.row.row-space-14
.row.row-space-16
.row.row-space-18
.row.row-space-20
.row.row-space-22
.row.row-space-24
.row.row-space-26
.row.row-space-28
.row.row-space-30
.valign-top
.valign-middle
.valign-bottom
.table-valign-top
.table-valign-middle
.table-valign-bottom
.table-th-valign-top
.table-td-valign-top
.table-th-valign-middle
.table-td-valign-middle
.table-th-valign-bottom
.table-td-valign-bottom
.pull-left
.pull-right
.pull-none
.no-rounded-corner
.rounded-corner
.vertical-box
.vertical-box-column
.vertical-box-row
.vertical-box-cell
.vertical-box-inner-cell
.overflow-auto
.overflow-visible
.overflow-scroll
.overflow-x-hidden
.overflow-x-visible
.overflow-x-scroll
.overflow-y-hidden
.overflow-y-visible
.overflow-y-scroll

#### Width & Height CSS Class

All the predefined css classes will override the defined css styling in your classes, UNLESS the `!important` is declared in your defined css styling.

Width | Height
--- | ---
.width-full (100%)
.width-lg (600px)
.width-md (450px)
.width-sm (300px)
.width-xs (150px)
.width-600
.width-550
.width-500
.width-450
.width-400
.width-350
.width-300
.width-250
.width-200
.width-150
.width-100
.width-90
.width-80
.width-70
.width-60
.width-50
.width-40
.width-30
.width-20
.width-10
.width-0
.height-full (100%)
.height-lg (600px)
.height-md (450px)
.height-sm (300px)
.height-xs (150px)
.height-600
.height-550
.height-500
.height-450
.height-400
.height-350
.height-300
.height-250
.height-200
.height-150
.height-100
.height-90
.height-80
.height-70
.height-60
.height-50
.height-40
.height-30
.height-20
.height-10
.height-0

#### Text & Font CSS Class

All the predefined css classes will override the defined css styling in your classes, UNLESS the `!important` is declared in your defined css styling.

Font Size | Font Weight | Text Align | Text Overflow
--- | --- | --- | ---
.f-s-8
.f-s-9
.f-s-10
.f-s-11
.f-s-12
.f-s-13
.f-s-14
.f-s-15
.f-s-16
.f-s-17
.f-s-18
.f-s-19
.f-s-20
.f-w-100
.f-w-200
.f-w-300
.f-w-400
.f-w-500
.f-w-600
.f-w-700
.text-center
.text-left
.text-right
.text-nowrap
.text-ellipsis

#### Margin CSS Class

All the predefined css classes will override the defined css styling in your classes, UNLESS the `!important` is declared in your defined css styling.

Margin | Margin Top | Margin Right | Margin Bottom | Margin Left
--- | --- | --- | --- | ---
.m-0
.m-1
.m-2
.m-3
.m-4
.m-5
.m-10
.m-15
.m-20
.m-25
.m-30
.m-35
.m-40
.m-auto
.m-t-0
.m-t-1
.m-t-2
.m-t-3
.m-t-4
.m-t-5
.m-t-10
.m-t-15
.m-t-20
.m-t-25
.m-t-30
.m-t-35
.m-t-40
.m-r-0
.m-r-1
.m-r-2
.m-r-3
.m-r-4
.m-r-5
.m-r-10
.m-r-15
.m-r-20
.m-r-25
.m-r-30
.m-r-35
.m-r-40
.m-b-0
.m-b-1
.m-b-2
.m-b-3
.m-b-4
.m-b-5
.m-b-10
.m-b-15
.m-b-20
.m-b-25
.m-b-30
.m-b-35
.m-b-40
.m-l-0
.m-l-1
.m-l-2
.m-l-3
.m-l-4
.m-l-5
.m-l-10
.m-l-15
.m-l-20
.m-l-25
.m-l-30
.m-l-35
.m-l-40

#### Padding CSS Class

All the predefined css classes will override the defined css styling in your classes, UNLESS the `!important` is declared in your defined css styling.

Padding | Padding Top | Padding Right | Padding Bottom | Padding Left
--- | --- | --- | --- | ---
.p-0
.p-1
.p-2
.p-3
.p-4
.p-5
.p-10
.p-15 / .wrapper
.p-20
.p-25
.p-30
.p-35
.p-40
.p-auto
.p-t-0
.p-t-1
.p-t-2
.p-t-3
.p-t-4
.p-t-5
.p-t-10
.p-t-15
.p-t-20
.p-t-25
.p-t-30
.p-t-35
.p-t-40
.p-r-0
.p-r-1
.p-r-2
.p-r-3
.p-r-4
.p-r-5
.p-r-10
.p-r-15
.p-r-20
.p-r-25
.p-r-30
.p-r-35
.p-r-40
.p-b-0
.p-b-1
.p-b-2
.p-b-3
.p-b-4
.p-b-5
.p-b-10
.p-b-15
.p-b-20
.p-b-25
.p-b-30
.p-b-35
.p-b-40
.p-l-0
.p-l-1
.p-l-2
.p-l-3
.p-l-4
.p-l-5
.p-l-10
.p-l-15
.p-l-20
.p-l-25
.p-l-30
.p-l-35
.p-l-40

#### Background CSS Class

All the predefined css classes will override the defined css styling in your classes, UNLESS the `!important` is declared in your defined css styling.

Blue | Indigo | Purple | Aqua | Teal
--- | --- | --- | --- | ---
.bg-blue-lighter
.bg-blue / .bg-primary
.bg-blue-darker
.bg-blue-transparent-9
.bg-blue-transparent-8
.bg-blue-transparent-7
.bg-blue-transparent-6
.bg-blue-transparent-5
.bg-blue-transparent-4
.bg-blue-transparent-3
.bg-blue-transparent-2
.bg-blue-transparent-1
.bg-gradient-blue
.bg-indigo-lighter
.bg-indigo
.bg-indigo-darker
.bg-indigo-transparent-9
.bg-indigo-transparent-8
.bg-indigo-transparent-7
.bg-indigo-transparent-6
.bg-indigo-transparent-5
.bg-indigo-transparent-4
.bg-indigo-transparent-3
.bg-indigo-transparent-2
.bg-indigo-transparent-1
.bg-gradient-indigo
.bg-purple-lighter
.bg-purple
.bg-purple-darker
.bg-purple-transparent-9
.bg-purple-transparent-8
.bg-purple-transparent-7
.bg-purple-transparent-6
.bg-purple-transparent-5
.bg-purple-transparent-4
.bg-purple-transparent-3
.bg-purple-transparent-2
.bg-purple-transparent-1
.bg-gradient-purple
.bg-aqua-lighter
.bg-aqua / .bg-info
.bg-aqua-darker
.bg-aqua-transparent-9
.bg-aqua-transparent-8
.bg-aqua-transparent-7
.bg-aqua-transparent-6
.bg-aqua-transparent-5
.bg-aqua-transparent-4
.bg-aqua-transparent-3
.bg-aqua-transparent-2
.bg-aqua-transparent-1
.bg-gradient-aqua
.bg-teal-lighter
.bg-teal / .bg-success
.bg-teal-darker
.bg-teal-transparent-9
.bg-teal-transparent-8
.bg-teal-transparent-7
.bg-teal-transparent-6
.bg-teal-transparent-5
.bg-teal-transparent-4
.bg-teal-transparent-3
.bg-teal-transparent-2
.bg-teal-transparent-1
.bg-gradient-teal
Green | Lime | Orange | Yellow | Red
.bg-green-lighter
.bg-green / .bg-success
.bg-green-darker
.bg-green-transparent-9
.bg-green-transparent-8
.bg-green-transparent-7
.bg-green-transparent-6
.bg-green-transparent-5
.bg-green-transparent-4
.bg-green-transparent-3
.bg-green-transparent-2
.bg-green-transparent-1
.bg-gradient-green
.bg-lime-lighter
.bg-lime
.bg-lime-darker
.bg-lime-transparent-9
.bg-lime-transparent-8
.bg-lime-transparent-7
.bg-lime-transparent-6
.bg-lime-transparent-5
.bg-lime-transparent-4
.bg-lime-transparent-3
.bg-lime-transparent-2
.bg-lime-transparent-1
.bg-gradient-lime
.bg-orange-lighter
.bg-orange / .bg-warning
.bg-orange-darker
.bg-orange-transparent-9
.bg-orange-transparent-8
.bg-orange-transparent-7
.bg-orange-transparent-6
.bg-orange-transparent-5
.bg-orange-transparent-4
.bg-orange-transparent-3
.bg-orange-transparent-2
.bg-orange-transparent-1
.bg-gradient-orange
.bg-yellow-lighter
.bg-yellow
.bg-yellow-darker
.bg-yellow-transparent-9
.bg-yellow-transparent-8
.bg-yellow-transparent-7
.bg-yellow-transparent-6
.bg-yellow-transparent-5
.bg-yellow-transparent-4
.bg-yellow-transparent-3
.bg-yellow-transparent-2
.bg-yellow-transparent-1
.bg-gradient-yellow
.bg-red-lighter
.bg-red / .bg-danger
.bg-red-darker
.bg-red-transparent-9
.bg-red-transparent-8
.bg-red-transparent-7
.bg-red-transparent-6
.bg-red-transparent-5
.bg-red-transparent-4
.bg-red-transparent-3
.bg-red-transparent-2
.bg-red-transparent-1
.bg-gradient-red
Pink | Black | Grey | Silver | White
.bg-pink-lighter
.bg-pink / .bg-danger
.bg-pink-darker
.bg-pink-transparent-9
.bg-pink-transparent-8
.bg-pink-transparent-7
.bg-pink-transparent-6
.bg-pink-transparent-5
.bg-pink-transparent-4
.bg-pink-transparent-3
.bg-pink-transparent-2
.bg-pink-transparent-1
.bg-gradient-pink
.bg-black-lighter
.bg-black / .bg-inverse
.bg-black-darker
.bg-black-transparent-9
.bg-black-transparent-8
.bg-black-transparent-7
.bg-black-transparent-6
.bg-black-transparent-5
.bg-black-transparent-4
.bg-black-transparent-3
.bg-black-transparent-2
.bg-black-transparent-1
.bg-gradient-black
.bg-grey-lighter
.bg-grey
.bg-grey-darker
.bg-grey-transparent-9
.bg-grey-transparent-8
.bg-grey-transparent-7
.bg-grey-transparent-6
.bg-grey-transparent-5
.bg-grey-transparent-4
.bg-grey-transparent-3
.bg-grey-transparent-2
.bg-grey-transparent-1
.bg-gradient-grey
.bg-light
.bg-silver
.bg-silver-darker
.bg-silver-transparent-9
.bg-silver-transparent-8
.bg-silver-transparent-7
.bg-silver-transparent-6
.bg-silver-transparent-5
.bg-silver-transparent-4
.bg-silver-transparent-3
.bg-silver-transparent-2
.bg-silver-transparent-1
.bg-gradient-silver
.bg-white
.bg-white-transparent-9
.bg-white-transparent-8
.bg-white-transparent-7
.bg-white-transparent-6
.bg-white-transparent-5
.bg-white-transparent-4
.bg-white-transparent-3
.bg-white-transparent-2
.bg-white-transparent-1
Extra |  |  |  |
.bg-none
.no-bg

#### Text Color CSS Class

All the predefined css classes will override the defined css styling in your classes, UNLESS the `!important` is declared in your defined css styling.

Blue | Indigo | Purple | Aqua | Teal
--- | --- | --- | --- | ---
.text-blue-lighter
.text-blue / .text-primary
.text-blue-darker
.text-blue-transparent-9
.text-blue-transparent-8
.text-blue-transparent-7
.text-blue-transparent-6
.text-blue-transparent-5
.text-blue-transparent-4
.text-blue-transparent-3
.text-blue-transparent-2
.text-blue-transparent-1
.text-indigo-lighter
.text-indigo
.text-indigo-darker
.text-indigo-transparent-9
.text-indigo-transparent-8
.text-indigo-transparent-7
.text-indigo-transparent-6
.text-indigo-transparent-5
.text-indigo-transparent-4
.text-indigo-transparent-3
.text-indigo-transparent-2
.text-indigo-transparent-1
.text-purple-lighter
.text-purple
.text-purple-darker
.text-purple-transparent-9
.text-purple-transparent-8
.text-purple-transparent-7
.text-purple-transparent-6
.text-purple-transparent-5
.text-purple-transparent-4
.text-purple-transparent-3
.text-purple-transparent-2
.text-purple-transparent-1
.text-aqua-lighter
.text-aqua / .text-info
.text-aqua-darker
.text-aqua-transparent-9
.text-aqua-transparent-8
.text-aqua-transparent-7
.text-aqua-transparent-6
.text-aqua-transparent-5
.text-aqua-transparent-4
.text-aqua-transparent-3
.text-aqua-transparent-2
.text-aqua-transparent-1
.text-teal-lighter
.text-teal / .text-success
.text-teal-darker
.text-teal-transparent-9
.text-teal-transparent-8
.text-teal-transparent-7
.text-teal-transparent-6
.text-teal-transparent-5
.text-teal-transparent-4
.text-teal-transparent-3
.text-teal-transparent-2
.text-teal-transparent-1
Green | Lime | Orange | Yellow | Red
.text-green-lighter
.text-green
.text-green-darker
.text-green-transparent-9
.text-green-transparent-8
.text-green-transparent-7
.text-green-transparent-6
.text-green-transparent-5
.text-green-transparent-4
.text-green-transparent-3
.text-green-transparent-2
.text-green-transparent-1
.text-lime-lighter
.text-lime
.text-lime-darker
.text-lime-transparent-9
.text-lime-transparent-8
.text-lime-transparent-7
.text-lime-transparent-6
.text-lime-transparent-5
.text-lime-transparent-4
.text-lime-transparent-3
.text-lime-transparent-2
.text-lime-transparent-1
.text-orange-lighter
.text-orange / .text-warning
.text-orange-darker
.text-orange-transparent-9
.text-orange-transparent-8
.text-orange-transparent-7
.text-orange-transparent-6
.text-orange-transparent-5
.text-orange-transparent-4
.text-orange-transparent-3
.text-orange-transparent-2
.text-orange-transparent-1
.text-yellow-lighter
.text-yellow
.text-yellow-darker
.text-yellow-transparent-9
.text-yellow-transparent-8
.text-yellow-transparent-7
.text-yellow-transparent-6
.text-yellow-transparent-5
.text-yellow-transparent-4
.text-yellow-transparent-3
.text-yellow-transparent-2
.text-yellow-transparent-1
.text-red-lighter
.text-red
.text-red-darker
.text-red-transparent-9
.text-red-transparent-8
.text-red-transparent-7
.text-red-transparent-6
.text-red-transparent-5
.text-red-transparent-4
.text-red-transparent-3
.text-red-transparent-2
.text-red-transparent-1
Pink | Black | Grey | Silver | White
.text-pink-lighter
.text-pink / .text-inverse
.text-pink-darker
.text-pink-transparent-9
.text-pink-transparent-8
.text-pink-transparent-7
.text-pink-transparent-6
.text-pink-transparent-5
.text-pink-transparent-4
.text-pink-transparent-3
.text-pink-transparent-2
.text-pink-transparent-1
.text-black-lighter
.text-black / .text-inverse
.text-black-darker
.text-black-transparent-9
.text-black-transparent-8
.text-black-transparent-7
.text-black-transparent-6
.text-black-transparent-5
.text-black-transparent-4
.text-black-transparent-3
.text-black-transparent-2
.text-black-transparent-1
.text-grey-lighter
.text-grey
.text-grey-darker
.text-grey-transparent-9
.text-grey-transparent-8
.text-grey-transparent-7
.text-grey-transparent-6
.text-grey-transparent-5
.text-grey-transparent-4
.text-grey-transparent-3
.text-grey-transparent-2
.text-grey-transparent-1
.text-silver-lighter
.text-silver / .text-muted
.text-silver-darker
.text-silver-transparent-9
.text-silver-transparent-8
.text-silver-transparent-7
.text-silver-transparent-6
.text-silver-transparent-5
.text-silver-transparent-4
.text-silver-transparent-3
.text-silver-transparent-2
.text-silver-transparent-1
.text-white
.text-white-transparent-9
.text-white-transparent-8
.text-white-transparent-7
.text-white-transparent-6
.text-white-transparent-5
.text-white-transparent-4
.text-white-transparent-3
.text-white-transparent-2
.text-white-transparent-1
Extra |  |  |  |
.text-gradient .bg-gradient-*

##### App Settings

Header Fixed
Header Inverse
Sidebar Fixed
Sidebar Grid
Sidebar Gradient

##### Admin Design (5)

##### Language Version (7)

##### Frontend Design (4)

Documentation Reset Local Storage