Skip to content

Instantly share code, notes, and snippets.

@geksilla
Last active September 2, 2025 15:26
Show Gist options
  • Select an option

  • Save geksilla/6543145 to your computer and use it in GitHub Desktop.

Select an option

Save geksilla/6543145 to your computer and use it in GitHub Desktop.
Bootstrap css class list
.navbar
.caret
.label
.table
.img-responsive
.img-rounded
.img-thumbnail
.img-circle
.sr-only
.lead
.text-muted
.text-primary
.text-warning
.text-danger
.text-success
.text-info
.text-left
.text-right
.text-center
.h6
.h1
.h2
.h3
.h4
.h5
.page-header
.list-unstyled
.list-inline
.initialism
.pull-right
.prettyprint
.pre-scrollable
.container
.row
.col-lg-12
.col-xs-11
.col-xs-1
.col-xs-2
.col-xs-3
.col-xs-4
.col-xs-5
.col-xs-6
.col-xs-7
.col-xs-8
.col-xs-9
.col-xs-10
.col-xs-12
.col-sm-11
.col-sm-1
.col-sm-2
.col-sm-3
.col-sm-4
.col-sm-5
.col-sm-6
.col-sm-7
.col-sm-8
.col-sm-9
.col-sm-10
.col-sm-12
.col-sm-push-1
.col-sm-push-2
.col-sm-push-3
.col-sm-push-4
.col-sm-push-5
.col-sm-push-6
.col-sm-push-7
.col-sm-push-8
.col-sm-push-9
.col-sm-push-10
.col-sm-push-11
.col-sm-pull-1
.col-sm-pull-2
.col-sm-pull-3
.col-sm-pull-4
.col-sm-pull-5
.col-sm-pull-6
.col-sm-pull-7
.col-sm-pull-8
.col-sm-pull-9
.col-sm-pull-10
.col-sm-pull-11
.col-sm-offset-1
.col-sm-offset-2
.col-sm-offset-3
.col-sm-offset-4
.col-sm-offset-5
.col-sm-offset-6
.col-sm-offset-7
.col-sm-offset-8
.col-sm-offset-9
.col-sm-offset-10
.col-sm-offset-11
.col-md-11
.col-md-1
.col-md-2
.col-md-3
.col-md-4
.col-md-5
.col-md-6
.col-md-7
.col-md-8
.col-md-9
.col-md-10
.col-md-12
.col-md-push-0
.col-md-push-1
.col-md-push-2
.col-md-push-3
.col-md-push-4
.col-md-push-5
.col-md-push-6
.col-md-push-7
.col-md-push-8
.col-md-push-9
.col-md-push-10
.col-md-push-11
.col-md-pull-0
.col-md-pull-1
.col-md-pull-2
.col-md-pull-3
.col-md-pull-4
.col-md-pull-5
.col-md-pull-6
.col-md-pull-7
.col-md-pull-8
.col-md-pull-9
.col-md-pull-10
.col-md-pull-11
.col-md-offset-0
.col-md-offset-1
.col-md-offset-2
.col-md-offset-3
.col-md-offset-4
.col-md-offset-5
.col-md-offset-6
.col-md-offset-7
.col-md-offset-8
.col-md-offset-9
.col-md-offset-10
.col-md-offset-11
.col-lg-11
.col-lg-1
.col-lg-2
.col-lg-3
.col-lg-4
.col-lg-5
.col-lg-6
.col-lg-7
.col-lg-8
.col-lg-9
.col-lg-10
.col-lg-push-0
.col-lg-push-1
.col-lg-push-2
.col-lg-push-3
.col-lg-push-4
.col-lg-push-5
.col-lg-push-6
.col-lg-push-7
.col-lg-push-8
.col-lg-push-9
.col-lg-push-10
.col-lg-push-11
.col-lg-pull-0
.col-lg-pull-1
.col-lg-pull-2
.col-lg-pull-3
.col-lg-pull-4
.col-lg-pull-5
.col-lg-pull-6
.col-lg-pull-7
.col-lg-pull-8
.col-lg-pull-9
.col-lg-pull-10
.col-lg-pull-11
.col-lg-offset-0
.col-lg-offset-1
.col-lg-offset-2
.col-lg-offset-3
.col-lg-offset-4
.col-lg-offset-5
.col-lg-offset-6
.col-lg-offset-7
.col-lg-offset-8
.col-lg-offset-9
.col-lg-offset-10
.col-lg-offset-11
.table-bordered
.table-responsive
.form-control
.form-group
.checkbox
.checkbox-inline
.input-sm
.input-lg
.control-label
.input-group-addon
.form-control-static
.help-block
.btn
.active
.btn-default
.btn-primary
.btn-warning
.btn-danger
.btn-success
.btn-info
.btn-link
.btn-lg
.btn-xs
.btn-block
.fade
.in
.collapse
.collapsing
.glyphicon
.dropdown
.dropdown-menu
.divider
.dropdown-header
.dropdown-backdrop
.btn-group-vertical
.btn-group
.dropdown-toggle
.btn-group-justified
.input-group
.col
.input-group-btn
.nav
.nav-divider
.nav-tabs
.nav-justified
.nav-tabs-justified
.pill-pane
.navbar-header
.navbar-collapse
.navbar-static-top
.navbar-fixed-bottom
.navbar-fixed-top
.navbar-brand
.navbar-toggle
.icon-bar
.navbar-nav
.navbar-left
.navbar-right
.navbar-form
.navbar-btn
.navbar-text
.navbar-default
.navbar-link
.navbar-inverse
.breadcrumb
.pagination
.pager
.label-default
.label-primary
.label-success
.label-info
.label-warning
.label-danger
.badge
.jumbotron
.thumbnail
.caption
.alert
.alert-link
.alert-dismissable
.close
.alert-success
.alert-info
.alert-warning
.alert-danger
.progress
.progress-bar
.progress-bar-success
.progress-bar-info
.progress-bar-warning
.progress-bar-danger
.media-body
.media
.media-object
.media-heading
.pull-left
.media-list
.list-group
.list-group-item
.list-group-item-heading
.list-group-item-text
.panel
.panel-body
.panel-heading
.panel-title
.panel-footer
.panel-default
.panel-primary
.panel-success
.panel-warning
.panel-danger
.panel-info
.well
.well-lg
.well-sm
.modal-open
.modal
.modal-dialog
.modal-content
.modal-backdrop
.modal-header
.modal-title
.modal-body
.modal-footer
.tooltip
.top
.right
.bottom
.left
.tooltip-inner
.tooltip-arrow
.popover
.popover-title
.popover-content
.arrow
.carousel
.carousel-inner
.item
.prev
.next
.carousel-control
.glyphicon-chevron-right
.icon-next
.carousel-indicators
.carousel-caption
.hide
.show
.invisible
.text-hide
.affix
.hidden
.visible-xs
.visible-sm
.visible-md
.visible-lg
.hidden-xs
.hidden-sm
.hidden-md
.hidden-lg
.visible-print
.hidden-print
@djhvscf

djhvscf commented Jul 11, 2014

Copy link
Copy Markdown

This list will be better when it has a description!

@aniketpatil11

Copy link
Copy Markdown

Hey guys...
you will find it on http://blog.seosemanticxhtml.com/a-complete-reference-library-of-bootstrap-classes/
with description !!!!!!!!!!!!!!

@panpixelov

Copy link
Copy Markdown

Aniketpatil007 that's reference to an old version of bootstrap 2.x, there are many changes in bootstrap 3

@jonathanbell

Copy link
Copy Markdown

Thanks! I think it's useful for sure! :)

@Mizuh0

Mizuh0 commented Sep 15, 2014

Copy link
Copy Markdown

This is great! Thanks so much

@BillyWM

BillyWM commented Oct 24, 2014

Copy link
Copy Markdown

I disagree that this is useless without a description. When you're just starting to learn Bootstrap and looking at people's live sites as examples, it's handy to have a reference telling you which classes are built-in and which are user-defined. This is a jumping-off point for you to type the names in Google and learn more about them (though many of the names are sufficiently descriptive as it is)

Anyhow, this is outdated, so I went ahead and generated an updated list for 3.2.0:

https://github.com/BillyWM/scraps/blob/master/bootstrap/bootstrap-full-class-list.txt

@duduindo

Copy link
Copy Markdown

Thanks!

@liderdesarrollo

Copy link
Copy Markdown

Thanks

@bpsingh716

Copy link
Copy Markdown

Thanks For The list But Plz. Add description

@MedUnes

MedUnes commented Apr 26, 2015

Copy link
Copy Markdown

I was looking for it.
what about developing a np++ to manage them?

@njtt

njtt commented Oct 9, 2015

Copy link
Copy Markdown

@braicauc

Copy link
Copy Markdown

Thank you! Very good list!

Those of you who want de descriptions just use a search engine.

http://www.afacerist.ro/

@Karthi2791

Copy link
Copy Markdown

nice

@fourwhitesocks

Copy link
Copy Markdown

Awesome, thank you!!

@sureshkonteti

Copy link
Copy Markdown

thnx it's useful list..

@JacobLett

Copy link
Copy Markdown

I created a desk reference pdf and a sortable table with descriptions to help sort through the list. You can find it here. https://bootstrapcreative.com/resources/bootstrap-3-css-classes-index/

@SunnyEMarcellus

Copy link
Copy Markdown

Nice Very Usefull

@Govind0155

Copy link
Copy Markdown

Very good information..........

@Hejprint

Hejprint commented Apr 5, 2016

Copy link
Copy Markdown

what with .form-inline and .form-horizontal?

@Frontend-MERN-Stack-Developer

Copy link
Copy Markdown

@VirendraWankhede

Copy link
Copy Markdown

Following link is useful to use Bootstrap classess with its description
http://tomasjanecek.cz/en/clanky/post/list-of-bootstrap-3-css-classes-with-description

@brandonFairbanks

Copy link
Copy Markdown

If this had descriptions, it would be extremely useful. Without them, it's only mildly helpful.

@greglomax

Copy link
Copy Markdown

I like this link, below. It allows you to preview the class.

http://www.w3schools.com/bootstrap/bootstrap_ref_all_classes.asp

ghost commented Apr 11, 2017

Copy link
Copy Markdown

Thanks very usefull

@adelante94

adelante94 commented Apr 23, 2017

Copy link
Copy Markdown

but I want know which class is subset of another class.

@JoeyEff

JoeyEff commented Apr 28, 2017

Copy link
Copy Markdown

Thank you!

@Slimaneha

Copy link
Copy Markdown

Thank you!

@shivendra143

Copy link
Copy Markdown

test

**** @

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment