--- layout: default title: Customize and download slug: customize lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to get your very own version. base_url: "../" ---
Choose which LESS files to compile into your custom build of Bootstrap. Not sure which files to use? Read through the CSS and Components pages in the docs
Choose which jQuery plugins should be included in your custom JavaScript files. Unsure what to include? Read the JavaScript page in the docs.
All checked plugins will be compiled into a readable bootstrap.js and a minified bootstrap.min.js. We recommend you use the minified version in production.
bootstrap.js
bootstrap.min.js
All plugins require the latest version of jQuery to be included.
Customize LESS variables to define colors, sizes and more inside your custom CSS stylesheets.
Background color applied to <body>.
<body>
Default sans-serif fonts.
Default serif fonts.
Default monospace fonts for <code> and <pre>.
<code>
<pre>
Used to globally set font-family in Bootstrap.
Used to calculate font-size throughout Bootstrap.
Used to calculate line-height throughout Bootstrap.
Choose a separate font-family for headings.
Choose a separate font-weight for headings.
Choose a separate line-height for headings.
Define custom colors used in several contexts.
Used for primary buttons, panels and more.
Used to indicate success.
Used to indicate a warning.
Used to indicate danger.
Used to indicate informational content.
Define your preferred colors for standard text and links.
Global color set on the body.
Global link color for text.
Automatically darken links on hover via color function.
Define the breakpoints at which your layout will change, adapting to different screen sizes.
Define the maximum width of .container for different screen sizes.
.container
For @screen-small and up.
@screen-small
For @screen-medium and up.
@screen-medium
For @screen-large and up.
@screen-large
Define your custom responsive grid.
Number of columns in the grid.
Padding between columns.
Point at which the navbar stops collapsing.
Define common padding and border radius sizes and more.
Used for active or hovered items in places like navs or dropdowns.
For each of Bootstrap's buttons, define text, background and border color.
Define colors for form feedback states and, by default, alerts.
Define alert colors, border radius, and padding.
Default background color used for all tables.
Background color used for .table-striped.
.table-striped
Background color used for .table-hover.
.table-hover
Border color for table and cell borders.
Text color for <input>s
<input>
<input> background color
<input> border color
<input> border radius
<input disabled> background color
<input disabled>
Placeholder text color
Background color for textual input addons
Border color for textual input addons
Dropdown menu background color
Dropdown menu border color
Dropdown menu border color for IE8
Indicator arrow for showing an element has a dropdown
Dropdown divider top border color
Text color for headers within dropdown menus
Dropdown text color
Hovered dropdown menu entry text color
Active dropdown menu entry text color
Active dropdown menu entry background color
Disabled dropdown menu entry background color
Panel body background color
Panel heading background color
Panel footer background color
Panel border color
Panel border radius
Primary text color
Primary border color
Primary heading background color
Success text color
Success border color
Success heading background color
Info text color
Info border color
Info heading background color
Warning text color
Warning border color
Warning heading background color
Danger text color
Danger border color
Danger heading background color
Badge text color
Badge background color
Linked badge text color on hover
Badge text color in active nav link
Breadcrumb text color
Breadcrumb background color
Text color of current page in the breadcrumb
Jumbotron background color
Jumbotron heading color
Jumbotron lead paragraph color
Padding applied to the modal body
Padding applied to the modal title
Modal title line-height
Background color of modal content area
Modal content border color
Modal content border color for IE8
Modal backdrop background color
Modal header border color
Modal footer border color
Default background color
Background color of single list elements on hover
Background color of active list elements
Default border color
List group border radius
Border color of active list elements
Text color of active list elements
Padding around the thumbnail image
Thumbnail background color
Thumbnail border color
Thumbnail border radius
Padding around the thumbnail caption
Custom text color for thumbnail captions
Background color of the whole progress component
Default progress bar color
Success progress bar color
Warning progress bar color
Danger progress bar color
Info progress bar color
Info progress bar text color
Info progress bar text shadow
Background color
Border color
Active background color
Active text color
Disabled text color
Pager border radius
Pager disabled state color
Default label background color
Primary label background color
Success label background color
Info label background color
Warning label background color
Danger label background color
Tooltip text color
Tooltip background color
Tooltip arrow width
Tooltip arrow color
Tooltip max width
Popover body background color
Popover title background color
Popover arrow width
Popover arrow color
Popover outer arrow width
Popover outer arrow color
Popover outer arrow fallback color
Popover maximum width
Popover border color
Popover fallback border color
Text muted color
Abbreviations and acronyms border color
Headings small color
Blockquote small color
Blockquote border color
Pag header border color
Horizontal line color
Horizontal offset for forms and lists
Hooray! Your custom version of Bootstrap is now ready to be compiled. Just click the button below to finish the process.
Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.