Skip to content
Twitter Bootstrap 3 Snippets Plugin for Sublime Text 2/3
Branch: master
Clone or download
JasonMortonNZ Merge pull request #103 from dave-ok/master
Amended docs to address leading '<' character
Latest commit 9b244c9 Jul 11, 2017
Type Name Latest commit message Commit time
Failed to load latest commit information.
badges Updated indentation of all files Oct 15, 2013
breadcrumbs Updated indentation of all files Oct 15, 2013
buttons Updated indentation of all files Oct 15, 2013
carousel Correct indentation Jun 15, 2015
cdn Added https to jquery cdn reference to correct broken link in bs3-cdn Feb 18, 2016
form Bug fixes, new snippets and updates May 29, 2015
grid Added Fluid Class To Col Jul 11, 2015
icons Add aria-hidden to glyphicon snippet Mar 13, 2015
images Updated indentation of all files Oct 15, 2013
input-groups Adding input-group snippets Mar 12, 2015
jumbotron Update bs3-jumbotron.sublime-snippet Feb 3, 2014
labels Updated indentation of all files Oct 15, 2013
link-buttons Add link-button snippets Mar 13, 2015
list-groups Updated indentation of all files Oct 15, 2013
media Updated indentation of all files Oct 15, 2013
messages Update 1-1-6.txt May 29, 2015
modal Bug fixes, new snippets and updates May 29, 2015
navigation Add container divs for the other navbar snippets Jun 14, 2015
pageheader Correct indentation Jun 15, 2015
table Updated indentation of all files Oct 15, 2013
tabs Correct indentation Jun 15, 2015
wells Updated Bootstrap CDN to 3.2 and included well snippet. Also updated … Jul 26, 2014 Merge pull request #103 from dave-ok/master Jul 11, 2017
messages.json Bug fixes, new snippets and updates May 29, 2015

Bootstrap 3 - Sublime Plugin

A sublime plugin complete with Bootstrap 3 snippets

Feel free to let me know what else you want added via:

What's included - contents


There are 3 methods for installing this plugin.

  1. Search for "Bootstrap 3 Snippets" via the "Package Control: Install Packages" menu. Note: If you don't have Sublime Package Control installed, you can find out how to install it here

  2. Clone the repository into your Sublime Text 2/3 packages directory. `git clone

  3. Download the .zip file and unzip it into your Sublime Text 2/3 packages directory. Note: You can find your Sublime Text 2/3 packages directory by going to Preferences > Browse Packages.


Start typing bs3 in html files and the autocomplete window opens. It matches fuzzily. So you can type bs3radio to find the bs3-input:radio snippet.

Be sure you have enabled "bs" in your Preferences.sublime-settings:

"auto_complete_triggers": [{"selector": "text.html", "characters": "bs3"}]

Note: If you experience any issues with a leading "<" please look at this issue thread for some potential solutions.


Component Snippet code
CDN link (both CSS & JS) bs3-cdn
CDN link (CSS only) bs3-cdn:css
CDN link (JS only) bs3-cdn:js


Component Snippet code
Link to local bootstrap files bs3-local


Component Snippet code
HTML5 Template Layout bs3-template:html5


Component Snippet code
Form bs3-form
Inline Form bs3-form:inline
Horizontal Form bs3-form:horizontal


Component Snippet code
Table bs3-table
Bordered Table bs3-table:bordered
Condensed Table bs3-table:condensed
Hover Table bs3-table:hover
Striped Table bs3-table:striped

Input Fields (Form fields)

Note: you can add " :h " to the end of any input field snippet to make it compatible with Bootstrap 3 horizontal forms. E.g.

  • bs3-input:text:h
  • bs3-input:hidden:h
Component Snippet code Options
Label bs3-input:label
Text Input bs3-input:text :h
Email Input bs3-input:email :h
Password Input bs3-input:password :h
Hidden Input bs3-input:hidden :h
Url Input bs3-input:url :h
Color Input bs3-input:color :h
Number Input bs3-input:number :h
Range Input bs3-input:range :h
Date Input bs3-input:date :h
Week Input bs3-input:week :h
Month Input bs3-input:month :h
Time Input bs3-input:time :h
Tel Input bs3-input:tel :h
Search Input bs3-input:search :h
Reset Input bs3-input:reset :h
Submit Input bs3-input:submit :h
Checkbox Input bs3-input:checkbox :h
Radio Box Input bs3-input:radio :h
Select Box bs3-select :h
Textarea bs3-textarea :h


Component Snippet code
Alert Box (Default) bs3-alert
Danger Alert Box bs3-alert:danger
Info Alert Box bs3-alert:info
Success Alert Box bs3-alert:success
Warning Alert Box bs3-alert:warning


Component Snippet code
Badge (Default) bs3-badge


Component Snippet code
Breadcrumbs bs3-breadcrumbs


Component Snippet code
Carousel bs3-carousel


Note: all button snippets below can have any of the following options append to the end of the snippet *.

  • :danger
  • :default
  • :disabled
  • :info
  • :primary
  • :success
  • :warning

An example:

  • bs3-button:success
  • bs3-large-button:disabled
  • bs3-block-button:warning
Component Snippet code Options
Button bs3-button *
Block Button bs3-block-button *
Mini Button bs3-xs-button *
Small Button bs3-sm-button *
Large Button bs3-lg-button *


Note: The bs3-col snippet can be used both on its own or with the addition of a colon followed by the number of columns required: E.g.

  • bs3-col
  • bs3-col:6
  • bs3-col:12
Component Snippet code Options
Column bs3-col :1-12
Row bs3-row
Container bs3-container


Component Snippet code
Glyphicon bs3-icon:glyphicon
Icon (Font Awesome) bs3-icon


Component Snippet code
Thumbnail bs3-thumbnail
Thumbnail with content bs3-thumbnail:content


Component Snippet code
Label bs3-label
Danger Label bs3-label:danger
Info Label bs3-label:info
Success Label bs3-label:success
Warning Label bs3-label:warning


Component Snippet code
Pager bs3-pager
Aligned Pager bs3-pager:aligned
Pagination bs3-pagination
Pagination:small bs3-pagination:sm
Pagination:large bs3-pagination:lg


Component Snippet code
Navbar (basic navbar) bs3-navbar
Navbar Brand Element bs3-navbar:brand
Navbar Button bs3-navbar:button
Navbar Form bs3-navbar:form
Navbar Link bs3-navbar:link
Navbar Text bs3-navbar:text
Navbar Fixed-Botton bs3-navbar:fixed-bottom
Navbar Fixed-Top bs3-navbar:fixed-top
Navbar Inverse bs3-navbar:inverse
Navbar Responsive bs3-navbar:responsive
Navbar Static-Top bs3-navbar:static-top


Component Snippet code
Jumbotron (ex Hero Unit) bs3-jumbotron


Component Snippet code
Panel bs3-panel
Panel (contextual) bs3-panel:{warning,success,info,danger,primary}
Panel (with heading) bs3-panel:heading
Panel (with footer) bs3-panel:footer


Component Snippet code
List group bs3-list-group
List group (with badges) bs3-list-group:badges
List group (linked list) bs3-list-group:linked
List group (with content) bs3-list-group:content

Media Objects

Component Snippet code
Media Object bs3-media-object


Component Snippet code
Clearfix bs3-clearfix


Component Snippet code
Well bs3-well
Well (small) bs3-well:sm
Well (large) bs3-well:lg


Component Snippet code
Tabs pane bs3-tabs


Component Snippet code
Input group bs3-input-group
Input group(addon & text-field) bs3-input-group:addon:text
Input group (addon) bs3-input-group-addon
Input group (button) bs3-input-group-btn
Input group (text-field & btn) bs3-input-group:text:btn


Bootstrap 3 - Sublime Plugin is open-sourced software licensed under the MIT license.

You can’t perform that action at this time.