Skip to content

Elements:Colours Utils

Useful colour classes for making text and blocks stand out or fade in.

Text Colours

White text has background colour so it can be seen.

.text-muted Cogo ille nibh pagus pertineo ratis sudo typicus venio.

.text-primary Amet cogo interdico magna molior nostrud quia quis.

.text-info Eros iustum voco. Aptent causa feugiat immitto ludus proprius usitas velit.

.text-success Autem cui hos humo incassum jus minim quidem secundum tation.

.text-warning Abluo ad camur capto consectetuer dolus nibh proprius tation.

.text-danger Elit facilisis quibus singularis usitas uxor vulputate.

.text-white Ad decet distineo vulputate. Commoveo esse ex ibidem molior pagus premo veniam verto zelus.

.text-dark Cogo euismod iusto mos neo olim quae vicis.

.text-light Eros mos pecus validus. Abbas acsi capto dolus gemino jus natu pecus secundum vulpes.

.text-grey Facilisi genitus quis suscipit valde. Camur defui quibus turpis vel vulpes vulputate.

.text-grey-dark Cogo dolus ea illum natu persto refero vereor.

.text-primary-faded Autem eros jumentum nisl nobis occuro refoveo vulpes.

.text-primary-dark Dignissim gravis immitto interdico obruo plaga saluto typicus.

.text-green Cui esca euismod ex iaceo scisco sit.

.text-red Adipiscing damnum jus lenis paratus turpis typicus.

.text-blue Decet enim gemino modo. Augue defui gilvus in quae refoveo secundum.

.text-purple Dolore ideo molior pecus pneum ulciscor.

.text-pink Antehabeo metuo populus te. At commodo consequat diam exputo iaceo interdico macto quadrum.

.text-orange Acsi exerci humo sit vereor. At decet huic natu occuro suscipit.

.text-lime Commoveo enim macto nobis. Acsi augue iusto quae sed tamen.

.text-blue-dark Iusto laoreet natu paulatim quadrum veniam vulputate.

.text-red-dark Abbas abico cui facilisis feugiat huic oppeto praemitto ullamcorper.

.text-brown Nimis nulla roto scisco singularis sino sit utinam validus veniam.

.text-cyan-dark Eum feugiat macto nulla plaga pneum proprius quae scisco ut.

.text-yellow Abdo autem commodo consequat decet exerci lobortis paulatim.

.text-slate Accumsan camur decet minim pala. Fere lenis occuro pertineo sagaciter tation venio.

.text-olive Elit erat gemino huic jus occuro refoveo vulputate.

.text-teal Jugis lenis nostrud obruo typicus verto vindico volutpat.

.text-green-bright Autem ex letalis persto venio. Brevitas defui distineo eligo jugis jumentum rusticus tation torqueo virtus.


Link Colours

White text has background colour so it can be seen.

.text-muted .text-primary .text-info .text-success .text-warning .text-danger .text-dark .text-light .text-grey .text-grey-dark .text-primary-faded .text-primary-dark .text-green .text-red .text-blue .text-purple .text-pink .text-orange .text-lime .text-blue-dark .text-red-dark .text-brown .text-cyan-dark .text-yellow .text-slate .text-olive .text-teal .text-green-bright

Background Colours

There are also a number of background colour classes which can be combined with the text colour classes above to provide contract.

.bg-faded At caecus cogo gemino iaceo lucidus luctus sudo utinam velit.

.bg-grey Brevitas ea lenis letalis nibh obruo os sagaciter.

.bg-grey-dark Aliquam brevitas ex facilisis hos huic importunus iusto probo.

.bg-primary Exerci ibidem imputo molior neque proprius ut veniam verto.

.bg-primary-faded At commodo commoveo haero nobis persto quae.

.bg-primary-dark Abico dolus ut valde. Dignissim importunus jugis natu neque nutus olim refoveo zelus.

.bg-info Abigo ad haero melior premo saluto uxor.

.bg-success Lenis natu uxor. Facilisi hendrerit olim singularis.

.bg-warning Augue interdico velit venio vereor. Mauris os suscipere.

.bg-danger Caecus erat humo sagaciter suscipit validus.

.bg-dark Defui exerci imputo nimis si. Caecus nobis quidem valde.

.bg-light Capto nostrud odio refero typicus. Bene dolus esse jugis jus pagus pertineo si valetudo.

.bg-shadow Abico quidem rusticus. Amet distineo dolor ludus paulatim quibus saluto utinam validus vulputate.

.bg-gradient Abluo imputo laoreet pagus pala verto.

.bg-gradient-flip Metuo nimis quia ulciscor. At iriure patria suscipere validus.

.bg-green Dolus fere feugiat illum minim paulatim sino tum.

.bg-red Gravis ille nostrud nulla pala rusticus suscipit.

.bg-blue Facilisis modo nisl. Abbas antehabeo commodo cui illum luctus vereor.

.bg-purple Capto dolore melior nobis. Abbas dolor exerci interdico praesent sudo tamen te.

.bg-pink Blandit commodo consequat dignissim gemino imputo occuro qui.

.bg-orange Jumentum rusticus sit. Abigo accumsan aliquip appellatio aptent laoreet macto persto secundum utinam.

.bg-lime At huic jus nisl saluto suscipit.

.bg-blue-dark Esca tincidunt torqueo. Et obruo patria pneum verto.

.bg-red-dark Aliquam ideo illum importunus laoreet letalis lucidus modo nutus velit.

.bg-brown Camur neo paratus qui verto. Accumsan aptent importunus nutus.

.bg-cyan-dark Brevitas defui eros et pagus sagaciter sit tamen velit.

.bg-yellow Abbas exerci exputo obruo proprius ulciscor verto.

.bg-slate Appellatio bene caecus diam ea validus.

.bg-olive Comis gilvus immitto importunus pneum qui quidne quis wisi.

.bg-teal Brevitas genitus huic ideo iriure luctus neque nimis ulciscor vulpes.

.bg-green-bright Aliquip hos modo similis tincidunt ullamcorper.


Background Colour Opacity

Control background colour opacity using the .bg-op-(1-9) classes for ultimate control over background colours.

.bg-op-1 + .bg-faded Fere jumentum nisl praemitto roto saepius.

.bg-op-2 + .bg-faded Hendrerit interdico pertineo. Amet dolore verto.

.bg-op-3 + .bg-faded Aptent cogo esca odio pecus secundum sed tum vindico virtus.

.bg-op-4 + .bg-faded Consequat erat illum imputo pecus pertineo praesent scisco typicus voco.

.bg-op-5 + .bg-faded Erat exputo olim refoveo.

.bg-op-6 + .bg-faded Amet dolore turpis zelus.

.bg-op-7 + .bg-faded Esse populus quia sino suscipere tincidunt typicus validus.

.bg-op-8 + .bg-faded Abdo iustum letalis molior paulatim premo sit tamen ullamcorper utinam.

.bg-op-9 + .bg-faded Abigo amet hos sagaciter torqueo tum.

.bg-op-1 + .bg-grey Euismod facilisis illum in os pecus proprius utrum voco.

.bg-op-2 + .bg-grey Causa molior vulputate. Antehabeo eligo exerci genitus lenis nimis obruo quia valetudo.

.bg-op-3 + .bg-grey Comis melior pala typicus vindico.

.bg-op-4 + .bg-grey At brevitas humo ideo pala quibus sagaciter sit uxor.

.bg-op-5 + .bg-grey Abdo elit euismod lenis praesent quibus valetudo.

.bg-op-6 + .bg-grey Aptent neo nostrud zelus.

.bg-op-7 + .bg-grey Abbas abluo duis fere huic laoreet neo nutus refero velit.

.bg-op-8 + .bg-grey Illum molior os quadrum.

.bg-op-9 + .bg-grey Huic premo virtus. Commoveo eu feugiat nobis quidne saluto validus.

.bg-op-1 + .bg-grey-dark Ad defui distineo duis esca haero.

.bg-op-2 + .bg-grey-dark Abigo ut vicis. Amet humo loquor odio paulatim probo secundum.

.bg-op-3 + .bg-grey-dark Abbas aliquip bene cogo genitus jugis lucidus praesent tum.

.bg-op-4 + .bg-grey-dark Exputo hendrerit ideo imputo inhibeo loquor sagaciter sino tincidunt ut.

.bg-op-5 + .bg-grey-dark Abdo gilvus loquor saepius suscipit te.

.bg-op-6 + .bg-grey-dark Aliquip dolore iusto singularis ulciscor.

.bg-op-7 + .bg-grey-dark Abico commoveo gemino suscipere tincidunt.

.bg-op-8 + .bg-grey-dark Abigo metuo quibus secundum tincidunt valde verto.

.bg-op-9 + .bg-grey-dark Ad bene iaceo importunus luctus magna metuo sagaciter.

.bg-op-1 + .bg-primary Consectetuer humo neo obruo quadrum.

.bg-op-2 + .bg-primary Augue caecus camur valde.

.bg-op-3 + .bg-primary Augue dolore ea jus.

.bg-op-4 + .bg-primary Diam fere hos pagus.

.bg-op-5 + .bg-primary Consectetuer duis nulla nunc sudo tamen valde verto.

.bg-op-6 + .bg-primary Distineo jumentum lucidus melior metuo nostrud premo tum vel.

.bg-op-7 + .bg-primary Commoveo natu similis. Meus odio persto proprius.

.bg-op-8 + .bg-primary Jugis nulla patria pneum qui tation venio virtus.

.bg-op-9 + .bg-primary Aliquip damnum ille immitto iustum minim mos nostrud quis.

.bg-op-1 + .bg-primary-faded Abico ad conventio inhibeo jus plaga.

.bg-op-2 + .bg-primary-faded Aptent commoveo erat ex lucidus metuo ratis vindico.

.bg-op-3 + .bg-primary-faded Erat esca facilisis lenis lobortis veniam.

.bg-op-4 + .bg-primary-faded Defui dolus enim. Defui ea et facilisi jumentum luptatum utinam wisi.

.bg-op-5 + .bg-primary-faded Abigo aptent et facilisi importunus mauris veniam venio.

.bg-op-6 + .bg-primary-faded Dolor dolus ea genitus iusto odio persto quibus voco.

.bg-op-7 + .bg-primary-faded Augue huic veniam. Ibidem pneum quadrum scisco.

.bg-op-8 + .bg-primary-faded Acsi iaceo singularis. Blandit esca gilvus tego.

.bg-op-9 + .bg-primary-faded Antehabeo lobortis macto pneum tamen turpis ut.

.bg-op-1 + .bg-primary-dark Abluo antehabeo duis minim patria praemitto usitas.

.bg-op-2 + .bg-primary-dark Haero pagus pertineo si tincidunt.

.bg-op-3 + .bg-primary-dark Aptent blandit commoveo eum magna natu quia ratis.

.bg-op-4 + .bg-primary-dark Jugis ludus paulatim saepius vel voco.

.bg-op-5 + .bg-primary-dark Accumsan amet bene defui enim natu nibh nostrud quibus verto.

.bg-op-6 + .bg-primary-dark Dolor feugiat gemino in iusto mauris molior nulla olim.

.bg-op-7 + .bg-primary-dark Cui persto vel. Damnum pneum turpis.

.bg-op-8 + .bg-primary-dark Lobortis neo turpis. Abluo ad conventio humo interdico nunc pecus.

.bg-op-9 + .bg-primary-dark Abigo antehabeo consectetuer facilisis fere immitto neque torqueo vereor.

.bg-op-1 + .bg-info Acsi conventio cui gemino singularis.

.bg-op-2 + .bg-info Blandit commodo gilvus nostrud suscipit ulciscor virtus.

.bg-op-3 + .bg-info Eu pala sit. Eligo lucidus sino venio.

.bg-op-4 + .bg-info Elit gilvus in quidne.

.bg-op-5 + .bg-info Acsi at facilisis nimis nobis quae quidne refoveo.

.bg-op-6 + .bg-info Antehabeo eligo eros nulla odio quae ratis roto.

.bg-op-7 + .bg-info Bene consectetuer et feugiat incassum obruo scisco ulciscor vicis.

.bg-op-8 + .bg-info Abigo luctus pneum scisco secundum voco.

.bg-op-9 + .bg-info Brevitas dolore minim mos quae saluto.

.bg-op-1 + .bg-success Camur erat magna quidne refoveo velit venio.

.bg-op-2 + .bg-success Aliquam capto consectetuer ea huic laoreet tego verto.

.bg-op-3 + .bg-success Abluo aliquam bene blandit premo tego vulpes.

.bg-op-4 + .bg-success Huic ille loquor paulatim proprius quibus te.

.bg-op-5 + .bg-success Acsi adipiscing aptent conventio dolus enim minim pertineo scisco vel.

.bg-op-6 + .bg-success Appellatio brevitas dignissim tincidunt ullamcorper.

.bg-op-7 + .bg-success At dolore magna mauris nibh os quidne saluto vulpes.

.bg-op-8 + .bg-success Defui hos lobortis. Abdo causa eros feugiat ibidem jumentum nunc saluto ut.

.bg-op-9 + .bg-success Brevitas consequat plaga. Cogo decet euismod exerci olim si.

.bg-op-1 + .bg-warning Blandit commoveo erat esse facilisi hendrerit ibidem metuo.

.bg-op-2 + .bg-warning Dolore enim ille tego.

.bg-op-3 + .bg-warning Consequat haero hos jugis letalis ratis tincidunt virtus.

.bg-op-4 + .bg-warning Camur pneum similis tum ut.

.bg-op-5 + .bg-warning Dignissim ea gilvus huic occuro sagaciter tum.

.bg-op-6 + .bg-warning Magna tum verto. Appellatio dolor elit iustum luptatum neque nobis paratus proprius tamen.

.bg-op-7 + .bg-warning Quae quis volutpat ymo.

.bg-op-8 + .bg-warning Blandit eligo gilvus hos mauris molior probo rusticus suscipit te.

.bg-op-9 + .bg-warning Causa commodo duis nimis ratis scisco sudo.

.bg-op-1 + .bg-danger Abbas elit erat in quibus roto valde velit zelus.

.bg-op-2 + .bg-danger Consectetuer facilisis imputo incassum mos paratus praesent sed valetudo.

.bg-op-3 + .bg-danger Abluo ideo melior. Abico ad cui ex gravis importunus minim typicus ut.

.bg-op-4 + .bg-danger Abluo iaceo quia turpis vulputate.

.bg-op-5 + .bg-danger Comis exerci luctus verto.

.bg-op-6 + .bg-danger Eligo eum jus qui.

.bg-op-7 + .bg-danger Camur damnum esca ille imputo laoreet metuo neque paulatim ratis.

.bg-op-8 + .bg-danger Esse refoveo tego virtus.

.bg-op-9 + .bg-danger Eu jumentum nunc secundum.

.bg-op-1 + .bg-dark Blandit commodo gemino refero vulpes.

.bg-op-2 + .bg-dark Abdo distineo luctus meus nobis obruo premo refoveo.

.bg-op-3 + .bg-dark Bene blandit esse jugis quia tego venio verto.

.bg-op-4 + .bg-dark Blandit neque paratus quidem roto saluto.

.bg-op-5 + .bg-dark Abluo consectetuer luptatum premo proprius veniam.

.bg-op-6 + .bg-dark Accumsan decet erat ex jugis oppeto proprius sit turpis vero.

.bg-op-7 + .bg-dark Fere gilvus huic immitto lucidus paratus quis ut vulputate.

.bg-op-8 + .bg-dark Humo singularis veniam volutpat.

.bg-op-9 + .bg-dark Cui enim facilisis meus vero.

.bg-op-1 + .bg-light Capto feugiat ibidem in laoreet probo quibus scisco ut validus.

.bg-op-2 + .bg-light Aliquam causa luptatum pecus quia sagaciter saluto ulciscor.

.bg-op-3 + .bg-light Augue eros facilisis inhibeo nobis paratus tego.

.bg-op-4 + .bg-light Abbas abdo ea imputo neo os paulatim pecus.

.bg-op-5 + .bg-light Inhibeo nulla vicis. Loquor macto modo molior mos.

.bg-op-6 + .bg-light Dolore ex mos nisl praemitto.

.bg-op-7 + .bg-light Acsi at saepius. Abluo conventio modo praesent saluto vicis.

.bg-op-8 + .bg-light Consectetuer pala si tamen voco.

.bg-op-9 + .bg-light Enim exerci huic ibidem iusto laoreet turpis veniam.

.bg-op-1 + .bg-gradient Exerci iaceo ideo occuro ut utinam valetudo wisi.

.bg-op-2 + .bg-gradient Facilisi imputo ludus nostrud.

.bg-op-3 + .bg-gradient Loquor nibh os similis sino suscipit utinam.

.bg-op-4 + .bg-gradient Gilvus iustum jugis pala tation ut vulputate.

.bg-op-5 + .bg-gradient Accumsan macto ratis sagaciter sit.

.bg-op-6 + .bg-gradient Enim esca eu molior praesent quidem scisco vel.

.bg-op-7 + .bg-gradient Humo valetudo virtus. Esca gravis neo suscipit virtus.

.bg-op-8 + .bg-gradient Cogo ideo vero vulputate.

.bg-op-9 + .bg-gradient Abico bene facilisis tego uxor.

.bg-op-1 + .bg-gradient-flip Caecus erat ex genitus lenis nostrud premo qui.

.bg-op-2 + .bg-gradient-flip Abico feugiat magna nisl sudo venio.

.bg-op-3 + .bg-gradient-flip Consectetuer exputo importunus quae.

.bg-op-4 + .bg-gradient-flip Autem cui facilisis gravis iriure ludus nostrud olim uxor.

.bg-op-5 + .bg-gradient-flip Accumsan causa ea exputo os patria quidem.

.bg-op-6 + .bg-gradient-flip Abbas iaceo scisco. Abigo genitus imputo natu occuro ut.

.bg-op-7 + .bg-gradient-flip Aliquam eligo pecus suscipit uxor.

.bg-op-8 + .bg-gradient-flip Abigo diam odio. Commodo consequat exputo in nimis proprius qui saepius vindico.

.bg-op-9 + .bg-gradient-flip Appellatio comis virtus. Autem distineo eligo metuo natu nostrud obruo paratus suscipere.

.bg-op-1 + .bg-green Aliquip aptent brevitas diam neo nobis proprius vero.

.bg-op-2 + .bg-green Eligo et importunus roto sino zelus.

.bg-op-3 + .bg-green Abdo iusto nobis odio vero.

.bg-op-4 + .bg-green Jus pala singularis suscipere.

.bg-op-5 + .bg-green Acsi dignissim iriure metuo sed vereor.

.bg-op-6 + .bg-green Amet damnum decet dolus euismod nunc nutus premo sino vindico.

.bg-op-7 + .bg-green At comis commodo exputo ille illum jugis mauris praesent valetudo.

.bg-op-8 + .bg-green Huic nibh nutus premo refero scisco torqueo vel.

.bg-op-9 + .bg-green Appellatio gemino gravis iustum quadrum quis validus wisi.

.bg-op-1 + .bg-red Caecus luptatum nostrud plaga qui.

.bg-op-2 + .bg-red Abigo brevitas plaga. Abbas aliquip vindico zelus.

.bg-op-3 + .bg-red Eros euismod lenis melior molior pertineo tego.

.bg-op-4 + .bg-red Appellatio decet euismod immitto rusticus.

.bg-op-5 + .bg-red Aptent cui facilisi incassum mauris modo singularis valetudo.

.bg-op-6 + .bg-red Olim paratus paulatim. Ad aliquip autem distineo dolus iriure iustum occuro quis.

.bg-op-7 + .bg-red Gemino ibidem melior secundum vindico.

.bg-op-8 + .bg-red Causa erat qui refoveo turpis.

.bg-op-9 + .bg-red Brevitas cogo conventio immitto macto molior neo sit uxor vulputate.

.bg-op-1 + .bg-blue Augue feugiat melior quidne roto valetudo.

.bg-op-2 + .bg-blue Abluo ea sudo ymo.

.bg-op-3 + .bg-blue Autem cogo jugis ulciscor.

.bg-op-4 + .bg-blue Bene esse ille letalis roto rusticus.

.bg-op-5 + .bg-blue Aptent cogo commodo hos nimis quidne.

.bg-op-6 + .bg-blue Acsi ad consequat euismod fere imputo interdico vicis vindico virtus.

.bg-op-7 + .bg-blue Augue cogo dignissim eum gilvus ludus mauris utinam uxor.

.bg-op-8 + .bg-blue Brevitas damnum ibidem letalis occuro odio sudo torqueo.

.bg-op-9 + .bg-blue Aliquip damnum enim esse haero ille importunus inhibeo proprius sit.

.bg-op-1 + .bg-purple Aliquip autem euismod ex plaga valde vereor vero verto.

.bg-op-2 + .bg-purple Brevitas luctus paratus. Amet dignissim nisl sed.

.bg-op-3 + .bg-purple Blandit capto macto pertineo quidem ullamcorper zelus.

.bg-op-4 + .bg-purple Abico fere iriure vero.

.bg-op-5 + .bg-purple Bene cogo conventio exputo importunus mauris quadrum sed.

.bg-op-6 + .bg-purple Accumsan autem defui nunc populus virtus.

.bg-op-7 + .bg-purple Acsi aliquip laoreet lucidus melior plaga quidne refoveo ymo.

.bg-op-8 + .bg-purple Ex odio qui. Abigo eligo exerci gilvus inhibeo nisl nulla sit typicus virtus.

.bg-op-9 + .bg-purple Commodo dolus eu inhibeo luctus macto persto.

.bg-op-1 + .bg-pink Adipiscing hendrerit illum iustum lucidus paulatim plaga tego.

.bg-op-2 + .bg-pink Antehabeo commodo metuo olim paratus praemitto quadrum sed tation.

.bg-op-3 + .bg-pink Iustum lobortis minim proprius quidne ratis.

.bg-op-4 + .bg-pink Abdo erat exerci haero luptatum nutus quae vel veniam.

.bg-op-5 + .bg-pink Distineo dolor et huic nibh nostrud tincidunt volutpat.

.bg-op-6 + .bg-pink Damnum dolor dolore facilisis haero turpis.

.bg-op-7 + .bg-pink Enim eros humo magna nobis nulla sed te ulciscor usitas.

.bg-op-8 + .bg-pink Ibidem in lobortis si tego.

.bg-op-9 + .bg-pink Abigo ad usitas uxor valde volutpat.

.bg-op-1 + .bg-orange Distineo exerci tum utinam.

.bg-op-2 + .bg-orange Camur defui ludus metuo meus mos refoveo.

.bg-op-3 + .bg-orange Abigo augue esca facilisi gemino jumentum pagus similis tego.

.bg-op-4 + .bg-orange Et sed suscipere turpis virtus.

.bg-op-5 + .bg-orange Cogo cui quidem ullamcorper.

.bg-op-6 + .bg-orange Loquor ludus turpis. Duis metuo neque pagus paratus populus qui vel vero zelus.

.bg-op-7 + .bg-orange Abbas commodo damnum erat eum pala populus vulputate.

.bg-op-8 + .bg-orange Aliquip caecus genitus ille in magna vel.

.bg-op-9 + .bg-orange Abbas bene damnum nunc pneum refero.

.bg-op-1 + .bg-lime Camur ea modo sed.

.bg-op-2 + .bg-lime Amet causa haero lobortis metuo meus persto pneum venio vindico.

.bg-op-3 + .bg-lime Accumsan gemino ille interdico obruo sit turpis.

.bg-op-4 + .bg-lime Amet causa lucidus quidne.

.bg-op-5 + .bg-lime Antehabeo defui eros secundum tation ut veniam.

.bg-op-6 + .bg-lime Camur consequat iustum letalis mauris pertineo quae volutpat.

.bg-op-7 + .bg-lime Caecus ea ille pala quidem.

.bg-op-8 + .bg-lime Esca humo ideo iustum lucidus metuo quae quis saepius.

.bg-op-9 + .bg-lime Gemino natu valetudo. Esse eu nimis valetudo.

.bg-op-1 + .bg-blue-dark Hendrerit inhibeo nunc premo quae utinam vindico wisi.

.bg-op-2 + .bg-blue-dark Comis esse melior. Abbas accumsan adipiscing laoreet vulputate.

.bg-op-3 + .bg-blue-dark Abigo appellatio laoreet nulla persto virtus.

.bg-op-4 + .bg-blue-dark Autem commodo dignissim dolus gilvus in molior quis sudo.

.bg-op-5 + .bg-blue-dark Euismod haero nunc os praemitto.

.bg-op-6 + .bg-blue-dark Acsi brevitas praesent quadrum quidne sagaciter singularis typicus valetudo veniam.

.bg-op-7 + .bg-blue-dark Adipiscing conventio eros facilisis haero minim nostrud probo qui veniam.

.bg-op-8 + .bg-blue-dark Antehabeo dolore ea modo paulatim te vindico.

.bg-op-9 + .bg-blue-dark Consectetuer esse in nutus os pecus plaga tego.

.bg-op-1 + .bg-red-dark Abigo camur gemino haero ideo iriure paratus vero.

.bg-op-2 + .bg-red-dark Defui hendrerit lobortis occuro probo quae.

.bg-op-3 + .bg-red-dark Gravis iustum loquor vel.

.bg-op-4 + .bg-red-dark Aliquip augue importunus nimis pagus proprius qui roto rusticus vel.

.bg-op-5 + .bg-red-dark Adipiscing eum jumentum magna mos oppeto pecus valde.

.bg-op-6 + .bg-red-dark Cogo comis distineo fere magna oppeto qui ratis utrum vel.

.bg-op-7 + .bg-red-dark Accumsan capto luctus nobis verto.

.bg-op-8 + .bg-red-dark Obruo vero virtus. Amet exerci modo.

.bg-op-9 + .bg-red-dark Capto eu neque si.

.bg-op-1 + .bg-brown At iaceo letalis luptatum melior molior plaga pneum.

.bg-op-2 + .bg-brown Abico saluto sit. Aptent cogo cui.

.bg-op-3 + .bg-brown Enim eu wisi. Autem iriure si.

.bg-op-4 + .bg-brown Olim paratus persto refoveo ymo.

.bg-op-5 + .bg-brown Esse et ideo plaga populus quae venio.

.bg-op-6 + .bg-brown Aptent nulla nutus refero sudo vereor vulpes.

.bg-op-7 + .bg-brown Esse feugiat neo quibus vero vulputate.

.bg-op-8 + .bg-brown Fere luctus probo volutpat.

.bg-op-9 + .bg-brown Brevitas capto conventio cui exerci laoreet usitas vindico.

.bg-op-1 + .bg-cyan-dark Aliquip conventio eligo jugis lenis praesent tation velit.

.bg-op-2 + .bg-cyan-dark Cogo et loquor mauris natu neo nobis utinam valetudo.

.bg-op-3 + .bg-cyan-dark Ad immitto nutus rusticus similis tation tego valde.

.bg-op-4 + .bg-cyan-dark Abbas accumsan acsi exputo fere jugis pala sudo valetudo.

.bg-op-5 + .bg-cyan-dark Acsi adipiscing cui lobortis populus quidem sed tum.

.bg-op-6 + .bg-cyan-dark Ad appellatio magna quis ulciscor vereor.

.bg-op-7 + .bg-cyan-dark Defui hos letalis nostrud pala vindico.

.bg-op-8 + .bg-cyan-dark Abdo aptent diam feugiat secundum sed suscipit valetudo.

.bg-op-9 + .bg-cyan-dark Aptent dolus mauris nutus qui roto ulciscor volutpat.

.bg-op-1 + .bg-yellow Euismod laoreet plaga tum.

.bg-op-2 + .bg-yellow Hos ille os quis vero.

.bg-op-3 + .bg-yellow Exputo iustum os quadrum sed singularis validus vulpes.

.bg-op-4 + .bg-yellow Autem cogo fere patria.

.bg-op-5 + .bg-yellow Abluo bene esse ille obruo patria ratis sit tego vero.

.bg-op-6 + .bg-yellow Brevitas lobortis nobis persto tincidunt ulciscor.

.bg-op-7 + .bg-yellow Acsi bene conventio lobortis nutus saepius saluto utinam vicis.

.bg-op-8 + .bg-yellow Aliquip comis exputo incassum lenis nutus odio persto proprius vel.

.bg-op-9 + .bg-yellow Autem jus paulatim. Abigo consectetuer ex nutus pneum praemitto sino ulciscor.

.bg-op-1 + .bg-slate Aliquam cui laoreet loquor ludus pala te.

.bg-op-2 + .bg-slate Accumsan distineo dolus ex gravis hendrerit persto utinam vindico.

.bg-op-3 + .bg-slate Aliquam dolore genitus ideo iusto pagus ullamcorper.

.bg-op-4 + .bg-slate Aliquam duis euismod ludus os pagus ratis sudo ullamcorper.

.bg-op-5 + .bg-slate Abbas ad et importunus obruo populus praemitto tation vel.

.bg-op-6 + .bg-slate Blandit cogo exputo incassum loquor similis validus.

.bg-op-7 + .bg-slate Abluo laoreet obruo patria quadrum si.

.bg-op-8 + .bg-slate Adipiscing amet causa exputo hos nostrud oppeto praemitto ulciscor.

.bg-op-9 + .bg-slate Ibidem inhibeo praesent premo quis saepius virtus.

.bg-op-1 + .bg-olive Caecus fere modo tincidunt vindico.

.bg-op-2 + .bg-olive Abbas causa dolore gemino nobis odio plaga.

.bg-op-3 + .bg-olive Appellatio distineo dolus eligo meus molior ullamcorper verto.

.bg-op-4 + .bg-olive Aptent praesent sagaciter sit zelus.

.bg-op-5 + .bg-olive Appellatio comis nibh pecus vero.

.bg-op-6 + .bg-olive Abdo abluo brevitas ibidem sed suscipere tation.

.bg-op-7 + .bg-olive Enim huic natu oppeto wisi.

.bg-op-8 + .bg-olive Eum plaga quibus saepius.

.bg-op-9 + .bg-olive Conventio ibidem uxor. Blandit cogo decet dolore humo illum jus nibh velit virtus.

.bg-op-1 + .bg-teal Abdo damnum ibidem vindico.

.bg-op-2 + .bg-teal Mauris quidem vindico. Accumsan capto illum immitto nibh nisl nulla tation vero.

.bg-op-3 + .bg-teal Comis conventio elit eros importunus os ratis typicus.

.bg-op-4 + .bg-teal Elit iriure nunc ratis.

.bg-op-5 + .bg-teal Esca neque vel. Aliquip facilisis fere gilvus jumentum.

.bg-op-6 + .bg-teal Abico appellatio augue consequat pertineo quae roto sit validus.

.bg-op-7 + .bg-teal Incassum neque os quidem usitas ut.

.bg-op-8 + .bg-teal Ad adipiscing cogo cui duis ibidem in natu sit.

.bg-op-9 + .bg-teal Distineo iaceo importunus mos nimis nobis sagaciter sino.

.bg-op-1 + .bg-green-bright Blandit mauris nunc. Aliquip cogo sagaciter.

.bg-op-2 + .bg-green-bright Commoveo exputo gravis olim scisco singularis te vereor.

.bg-op-3 + .bg-green-bright Consequat elit humo imputo luctus ut voco.

.bg-op-4 + .bg-green-bright Et iusto os persto volutpat.

.bg-op-5 + .bg-green-bright Eligo lenis metuo nibh nostrud sudo tation voco.

.bg-op-6 + .bg-green-bright Capto odio pneum sino vereor.

.bg-op-7 + .bg-green-bright Ea ex uxor. Distineo importunus molior persto praesent quadrum quidem.

.bg-op-8 + .bg-green-bright Exputo jumentum laoreet meus populus similis sudo tum validus vulpes.

.bg-op-9 + .bg-green-bright Appellatio bene imputo in luctus tego.


Border Colours

There are also a number of border colour classes which an elements bordered colour to be set.

You can set thicker borders using the border-w-(2-5) classes.

You can also remove borders using the border-0 and border-SIDE-0 classes.

.border-primary Commodo consequat feugiat jugis laoreet tamen typicus.
.border-info Brevitas eros et exputo. Et ex nulla valetudo.
.border-success Appellatio bene dolus eligo ex neque quidem refoveo.
.border-warning Camur cogo consectetuer esca lucidus melior qui.
.border-danger Hos loquor paulatim vel velit. Adipiscing erat esca gilvus hendrerit humo iaceo letalis saluto volutpat.
.border-grey Cui esse in quidem suscipere. Dolore duis ideo nostrud suscipit tego.
.border-grey-dark Abluo bene duis gravis huic humo quibus secundum te verto.
.border-primary-faded Distineo ex praemitto rusticus sino. Camur facilisi lobortis luptatum metuo nibh.
.border-primary-dark Comis cui defui gravis iaceo quae torqueo turpis.
.border-dark Accumsan enim iaceo pagus quibus torqueo veniam volutpat.
.border-light Conventio nunc tation velit vero. Abigo appellatio caecus capto macto mos natu quibus.
.border-green Accumsan caecus conventio distineo genitus illum sudo velit vulputate ymo.
.border-red Camur pala paulatim zelus. Aptent dolor feugiat gemino venio vulpes.
.border-blue Commoveo inhibeo jugis luctus olim similis.
.border-purple Eros luptatum quadrum refoveo tincidunt utinam vicis.
.border-pink Consectetuer dignissim euismod hendrerit ideo loquor oppeto pagus quae.
.border-orange Abluo minim nobis quae torqueo. Dolus luctus scisco.
.border-lime Abbas nulla occuro quibus singularis. Ad commoveo distineo iustum obruo oppeto patria plaga.
.border-blue-dark Et gilvus loquor odio os refero turpis.
.border-red-dark Ad augue dignissim esca exerci haero modo pagus valde.
.border-brown Damnum huic imputo loquor occuro populus veniam vindico.
.border-cyan-dark Consectetuer ideo quidne. Cogo esse jus natu ratis roto rusticus veniam vindico vulpes.
.border-yellow Cogo enim secundum tamen. Capto et eum ideo neo.
.border-slate Augue populus refero. Aliquam consectetuer defui ibidem letalis lucidus tum typicus.
.border-olive Cui gravis ideo loquor luctus pecus sed vero.
.border-teal Imputo laoreet loquor magna minim natu nisl nunc sudo.
.border-green-bright Et humo jus pala quis ymo.

Border Colour Opacity

Control border colour opacity using the .border-op-(1-9) classes for ultimate control over border colours.

.border-op-1 + .border-primary

.border-op-2 + .border-primary

.border-op-3 + .border-primary

.border-op-4 + .border-primary

.border-op-5 + .border-primary

.border-op-6 + .border-primary

.border-op-7 + .border-primary

.border-op-8 + .border-primary

.border-op-9 + .border-primary

.border-op-1 + .border-info

.border-op-2 + .border-info

.border-op-3 + .border-info

.border-op-4 + .border-info

.border-op-5 + .border-info

.border-op-6 + .border-info

.border-op-7 + .border-info

.border-op-8 + .border-info

.border-op-9 + .border-info

.border-op-1 + .border-success

.border-op-2 + .border-success

.border-op-3 + .border-success

.border-op-4 + .border-success

.border-op-5 + .border-success

.border-op-6 + .border-success

.border-op-7 + .border-success

.border-op-8 + .border-success

.border-op-9 + .border-success

.border-op-1 + .border-warning

.border-op-2 + .border-warning

.border-op-3 + .border-warning

.border-op-4 + .border-warning

.border-op-5 + .border-warning

.border-op-6 + .border-warning

.border-op-7 + .border-warning

.border-op-8 + .border-warning

.border-op-9 + .border-warning

.border-op-1 + .border-danger

.border-op-2 + .border-danger

.border-op-3 + .border-danger

.border-op-4 + .border-danger

.border-op-5 + .border-danger

.border-op-6 + .border-danger

.border-op-7 + .border-danger

.border-op-8 + .border-danger

.border-op-9 + .border-danger

.border-op-1 + .border-grey

.border-op-2 + .border-grey

.border-op-3 + .border-grey

.border-op-4 + .border-grey

.border-op-5 + .border-grey

.border-op-6 + .border-grey

.border-op-7 + .border-grey

.border-op-8 + .border-grey

.border-op-9 + .border-grey

.border-op-1 + .border-grey-dark

.border-op-2 + .border-grey-dark

.border-op-3 + .border-grey-dark

.border-op-4 + .border-grey-dark

.border-op-5 + .border-grey-dark

.border-op-6 + .border-grey-dark

.border-op-7 + .border-grey-dark

.border-op-8 + .border-grey-dark

.border-op-9 + .border-grey-dark

.border-op-1 + .border-primary-faded

.border-op-2 + .border-primary-faded

.border-op-3 + .border-primary-faded

.border-op-4 + .border-primary-faded

.border-op-5 + .border-primary-faded

.border-op-6 + .border-primary-faded

.border-op-7 + .border-primary-faded

.border-op-8 + .border-primary-faded

.border-op-9 + .border-primary-faded

.border-op-1 + .border-primary-dark

.border-op-2 + .border-primary-dark

.border-op-3 + .border-primary-dark

.border-op-4 + .border-primary-dark

.border-op-5 + .border-primary-dark

.border-op-6 + .border-primary-dark

.border-op-7 + .border-primary-dark

.border-op-8 + .border-primary-dark

.border-op-9 + .border-primary-dark

.border-op-1 + .border-dark

.border-op-2 + .border-dark

.border-op-3 + .border-dark

.border-op-4 + .border-dark

.border-op-5 + .border-dark

.border-op-6 + .border-dark

.border-op-7 + .border-dark

.border-op-8 + .border-dark

.border-op-9 + .border-dark

.border-op-1 + .border-light

.border-op-2 + .border-light

.border-op-3 + .border-light

.border-op-4 + .border-light

.border-op-5 + .border-light

.border-op-6 + .border-light

.border-op-7 + .border-light

.border-op-8 + .border-light

.border-op-9 + .border-light

.border-op-1 + .border-green

.border-op-2 + .border-green

.border-op-3 + .border-green

.border-op-4 + .border-green

.border-op-5 + .border-green

.border-op-6 + .border-green

.border-op-7 + .border-green

.border-op-8 + .border-green

.border-op-9 + .border-green

.border-op-1 + .border-red

.border-op-2 + .border-red

.border-op-3 + .border-red

.border-op-4 + .border-red

.border-op-5 + .border-red

.border-op-6 + .border-red

.border-op-7 + .border-red

.border-op-8 + .border-red

.border-op-9 + .border-red

.border-op-1 + .border-blue

.border-op-2 + .border-blue

.border-op-3 + .border-blue

.border-op-4 + .border-blue

.border-op-5 + .border-blue

.border-op-6 + .border-blue

.border-op-7 + .border-blue

.border-op-8 + .border-blue

.border-op-9 + .border-blue

.border-op-1 + .border-purple

.border-op-2 + .border-purple

.border-op-3 + .border-purple

.border-op-4 + .border-purple

.border-op-5 + .border-purple

.border-op-6 + .border-purple

.border-op-7 + .border-purple

.border-op-8 + .border-purple

.border-op-9 + .border-purple

.border-op-1 + .border-pink

.border-op-2 + .border-pink

.border-op-3 + .border-pink

.border-op-4 + .border-pink

.border-op-5 + .border-pink

.border-op-6 + .border-pink

.border-op-7 + .border-pink

.border-op-8 + .border-pink

.border-op-9 + .border-pink

.border-op-1 + .border-orange

.border-op-2 + .border-orange

.border-op-3 + .border-orange

.border-op-4 + .border-orange

.border-op-5 + .border-orange

.border-op-6 + .border-orange

.border-op-7 + .border-orange

.border-op-8 + .border-orange

.border-op-9 + .border-orange

.border-op-1 + .border-lime

.border-op-2 + .border-lime

.border-op-3 + .border-lime

.border-op-4 + .border-lime

.border-op-5 + .border-lime

.border-op-6 + .border-lime

.border-op-7 + .border-lime

.border-op-8 + .border-lime

.border-op-9 + .border-lime

.border-op-1 + .border-blue-dark

.border-op-2 + .border-blue-dark

.border-op-3 + .border-blue-dark

.border-op-4 + .border-blue-dark

.border-op-5 + .border-blue-dark

.border-op-6 + .border-blue-dark

.border-op-7 + .border-blue-dark

.border-op-8 + .border-blue-dark

.border-op-9 + .border-blue-dark

.border-op-1 + .border-red-dark

.border-op-2 + .border-red-dark

.border-op-3 + .border-red-dark

.border-op-4 + .border-red-dark

.border-op-5 + .border-red-dark

.border-op-6 + .border-red-dark

.border-op-7 + .border-red-dark

.border-op-8 + .border-red-dark

.border-op-9 + .border-red-dark

.border-op-1 + .border-brown

.border-op-2 + .border-brown

.border-op-3 + .border-brown

.border-op-4 + .border-brown

.border-op-5 + .border-brown

.border-op-6 + .border-brown

.border-op-7 + .border-brown

.border-op-8 + .border-brown

.border-op-9 + .border-brown

.border-op-1 + .border-cyan-dark

.border-op-2 + .border-cyan-dark

.border-op-3 + .border-cyan-dark

.border-op-4 + .border-cyan-dark

.border-op-5 + .border-cyan-dark

.border-op-6 + .border-cyan-dark

.border-op-7 + .border-cyan-dark

.border-op-8 + .border-cyan-dark

.border-op-9 + .border-cyan-dark

.border-op-1 + .border-yellow

.border-op-2 + .border-yellow

.border-op-3 + .border-yellow

.border-op-4 + .border-yellow

.border-op-5 + .border-yellow

.border-op-6 + .border-yellow

.border-op-7 + .border-yellow

.border-op-8 + .border-yellow

.border-op-9 + .border-yellow

.border-op-1 + .border-slate

.border-op-2 + .border-slate

.border-op-3 + .border-slate

.border-op-4 + .border-slate

.border-op-5 + .border-slate

.border-op-6 + .border-slate

.border-op-7 + .border-slate

.border-op-8 + .border-slate

.border-op-9 + .border-slate

.border-op-1 + .border-olive

.border-op-2 + .border-olive

.border-op-3 + .border-olive

.border-op-4 + .border-olive

.border-op-5 + .border-olive

.border-op-6 + .border-olive

.border-op-7 + .border-olive

.border-op-8 + .border-olive

.border-op-9 + .border-olive

.border-op-1 + .border-teal

.border-op-2 + .border-teal

.border-op-3 + .border-teal

.border-op-4 + .border-teal

.border-op-5 + .border-teal

.border-op-6 + .border-teal

.border-op-7 + .border-teal

.border-op-8 + .border-teal

.border-op-9 + .border-teal

.border-op-1 + .border-green-bright

.border-op-2 + .border-green-bright

.border-op-3 + .border-green-bright

.border-op-4 + .border-green-bright

.border-op-5 + .border-green-bright

.border-op-6 + .border-green-bright

.border-op-7 + .border-green-bright

.border-op-8 + .border-green-bright

.border-op-9 + .border-green-bright

Awesome Features

99.9% Uptime / Free Upgrades / Fully Responsive / Bug Free
Theme Colours

Green Red Blue Purple Pink Orange Lime Blue-dark Red-dark Brown Cyan-dark Yellow Slate Olive Teal Green-bright

Cookies are NOT enabled so colour selection is not persistent.

Back to main homepage

Back to intro page