Jump to: navigation, search

Bootstrapskin Colour Classes

Colour Classes

Each BootStrapSkin stylesheet has 23 colours to choose from, 4 Bootstrap and 14 custom colours, and a further 5 shades of the stylesheet being used.

The examples below use the bootstrap-blue.css stylesheet, but you can also choose from 10 other colour styles.

Shaded colour classes;

default
light
lighter
dark
darker

BootStrap colour classes;

info
success
warning
danger

Custom colour classes;

neutral
neutral-light
primary
cyanide
meadow
cocktail
mango
berry
hearts
party

midnight
cello
hollow
concrete

In the code below "neutral" is the button colour, simply replace "neutral" with one of the colour classes shown in the example sections.

<div class="btn btn-neutral"><i class="fa fa-exclamation-triangle"></i> neutral</div>

Modifying panels, wells, alerts and any other feature that can be colour styled, the format is (replace with your colour class choice);

<div class="panel panel-neutral">
<div class="panel panel-cello">
<div class="well well-neutral">
<div class="well well-midnight">
<div class="alert alert-neutral">
<div class="alert alert-primary">

Not much can be said with regard to tips for colour classes.

You may however consider creating your own sheet with custom colour classes, which contrary to popular belief is a lot simpler than it may seem. Once you've mapped the main colour and its shades, simply use the "search and replace" feature of Notepad ++ to add your new colours.

bootstrapskin-commercial-skin.png