mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-27 20:14:13 +03:00
5.2 KiB
5.2 KiB
| layout | title | group |
|---|---|---|
| docs | Customization options | getting-started |
With Bootstrap 4, we've added a handful of global options for easily customizing all the components in your project. These options are handled by Sass variables. Simply change a variable's value and recompile with the included Gruntfile.
Available variables
You can find and customize these variables in our _variables.scss file.
| Variable | Values | Description |
|---|---|---|
$spacer |
1rem (default), or any value > 0 |
Specifies the default spacer value for our spacer utilities. |
$enable-flex |
true or false (default) |
Swaps float and display: table styles for display: flex. |
$enable-rounded |
true (default) or false |
Enables predefined border-radius styles on various components. |
$enable-shadows |
true or false (default) |
Enables predefined box-shadow styles on various components. |
$enable-gradients |
true or false (default) |
Enables predefined gradients via background-image various components. |
$enable-transitions |
true (default) or false |
Enables predefined transitions on various components. |
$enable-hover-media-query |
true or false (default) |
... |
Color palette
Bootstrap's color palette includes a numerical range of shades for each base color, heavily inspired by Google's color palette. Base colors, which utilize Sass color functions to generate each shade, are indicated at the top of each stacked palette.
100
100
200
300
400
500
600
700
800
900
500
100
200
300
400
500
600
700
800
900
500
100
200
300
400
500
600
700
800
900
500
100
200
300
400
500
600
700
800
900
500
100
200
300
400
500
600
700
800
900
500
100
200
300
400
500
600
700
800
900