--- 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

Basics

Layout

Global CSS

Utility classes

Components

Navigation

Content blocks

Behavioral (requires JS)

Media

Miscellaneous

Choose which jQuery plugins should be included in your custom JavaScript files. Unsure what to include? Read the JavaScript page in the docs.

Linked to components

Magic

Produces two files

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.

jQuery required

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.

Basics

Body background

Background color applied to <body>.

Typography

Default sans-serif fonts.

Default serif fonts.

Default monospace fonts for <code> and <pre>.

Used to globally set font-family in Bootstrap.

Used to calculate font-size throughout Bootstrap.

Used to calculate line-height throughout Bootstrap.

Code blocks

Headings

Choose a separate font-family for headings.

Choose a separate font-weight for headings.

Choose a separate line-height for headings.

Colors

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.

Media queries breakpoints

Define the breakpoints at which your layout will change, adapting to different screen sizes.

Container sizes

Define the maximum width of .container for different screen sizes.

For @screen-small and up.

For @screen-medium and up.

For @screen-large and up.

Grid system

Define your custom responsive grid.

Number of columns in the grid.

Padding between columns.

Point at which the navbar stops collapsing.

Components

Define common padding and border radius sizes and more.

Padding

Border radius sizes

Active background color

Used for active or hovered items in places like navs or dropdowns.

Buttons

For each of Bootstrap's buttons, define text, background and border color.

Default

Primary

Info

Button hover

Success

Warning

Danger

Form states and alerts

Define colors for form feedback states and, by default, alerts.

Success

Warning

Danger

Info

Alerts

Define alert colors, border radius, and padding.

Border radius

Default (Warning)

Success

Danger

Info

Navbar

Default navbar

Basics

Links

Brand

Toggle

Inverted navbar

Basics

Links

Brand

Toggle

Nav

Default nav

Common values

Pills

Tabs

Tables

Default background color used for all tables.

Background color used for .table-striped.

Background color used for .table-hover.

Border color for table and cell borders.

Forms

Inputs

Text color for <input>s

<input> background color

<input> border color

<input> border radius

<input disabled> background color

Placeholder

Placeholder text color

Legend

Input groups

Background color for textual input addons

Border color for textual input addons

Dropdowns

Dropdown menu

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 items

Dropdown text color

Hovered dropdown menu entry 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

Panels and wells

Default panel styles

Panel body background color

Panel heading background color

Panel footer background color

Panel border color

Panel border radius

Contextual panel colors

Primary

Primary text color

Primary border color

Primary heading background color

Success

Success text color

Success border color

Success heading background color

Info

Info text color

Info border color

Info heading background color

Warning

Warning text color

Warning border color

Warning heading background color

Danger

Danger text color

Danger border color

Danger heading background color

Wells

Accordion

Badges

Badge text color

Badge background color

Linked badge text color on hover

Badge text color in active nav link

Badge text color in active nav link

Breadcrumbs

Breadcrumb text color

Breadcrumb background color

Text color of current page in the breadcrumb

Jumbotron

Jumbotron background color

Jumbotron heading color

Jumbotron lead paragraph color

Modals

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

List group

Background

Default background color

Background color of single list elements on hover

Background color of active list elements

Borders

Default border color

List group border radius

Border color of active list elements

Text color of active list elements

Thumbnails

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

Progress bars

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

Pagination

Background color

Border color

Active background color

Active text color

Disabled text color

Pager

Pager border radius

Pager disabled state color

Labels

Default label background color

Primary label background color

Success label background color

Info label background color

Warning label background color

Danger label background color

Tooltips and popovers

Tooltip styles

Tooltip text color

Tooltip background color

Tooltip arrow width

Tooltip arrow color

Tooltip max width

Popover styles

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

Close button

Type

Text muted color

Abbreviations and acronyms border color

Headings small color

Blockquote small color

Blockquote border color

Pag header border color

Other

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.

What's included?

Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.