- Python dash bootstrap components
- Table of contents
- Installation
- PyPI
- Anaconda
- Quick start
- Linking a stylesheet
- Build the layout
- Standard row and column-based layouts
- Cards
- Tabs
- Forms
- Dropdown menus
- Tooltips
- Contributing
- Copyright and license
- Dash Bootstrap Components
- Installation
- PyPI
- Anaconda
- Quick start
- Linking a stylesheet
- Build the layout
- Contributing
- Copyright and license
- Saved searches
- Use saved searches to filter your results more quickly
- License
- facultyai/dash-bootstrap-components
- Name already in use
- Sign In Required
- Launching GitHub Desktop
- Launching GitHub Desktop
- Launching Xcode
- Launching Visual Studio Code
- Latest commit
- Git stats
- Files
- README.md
- Quickstart
- Anaconda
- Basic usage
- Linking a stylesheet
- Build the layout
- Examples
Python dash bootstrap components
dash-bootstrap-components is a library of Bootstrap components for use with Plotly Dash, that makes it easier to build consistently styled Dash apps with complex, responsive layouts.
Table of contents
Installation
PyPI
You can install dash-bootstrap-components with pip :
pip install dash-bootstrap-components
Anaconda
You can also install dash-bootstrap-components with conda through the conda-forge channel:
conda install -c conda-forge dash-bootstrap-components
Quick start
To use dash-bootstrap-components you must do two things:
- Link a Bootstrap v5 compatible stylesheet
- Incorporate dash-bootstrap-components into your layout
Linking a stylesheet
dash-bootstrap-components doesn’t come with CSS included. This is to give you the freedom to use any Bootstrap v5 stylesheet of your choice. This means however that in order for the components to be styled properly, you must link to a stylesheet yourself.
For convenience, links to BootstrapCDN for each theme are available through the themes module, which can be used as follows:
import dash import dash_bootstrap_components as dbc app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
For more information on how to link local or external CSS, check out the Dash documentation.
Build the layout
With CSS linked, you can start building your app’s layout with our Bootstrap components. See our documentation for a full list of available components, which include:
Standard row and column-based layouts
Cards
Tabs
Forms
Dropdown menus
Tooltips
Contributing
We welcome contributions to dash-bootstrap-components. If you find a bug or something is unclear please submit a bug report, if you have ideas for new features please feel free to make a feature request.
If you would like to submit a pull request, please read our contributing guide, which contains instructions on how to build and install dash-bootstrap-components locally, how to check your code will pass our linting checks, and how to submit the pull request itself.
Copyright and license
Code and documentation is copyright Faculty Science Ltd. 2018-2022, and released under the Apache 2.0 license
Dash Bootstrap Components
dash-bootstrap-components is a library of Bootstrap components for use with Plotly Dash, that makes it easier to build consistently styled Dash apps with complex, responsive layouts.
Installation
PyPI
You can install dash-bootstrap-components with pip :
pip install dash-bootstrap-components
Anaconda
You can also install dash-bootstrap-components with conda through the conda-forge channel:
conda install -c conda-forge dash-bootstrap-components
Quick start
To use dash-bootstrap-components you must do two things:
- Link a Bootstrap v5 compatible stylesheet
- Incorporate dash-bootstrap-components into your layout
Linking a stylesheet
dash-bootstrap-components doesn’t come with CSS included. This is to give you the freedom to use any Bootstrap v5 stylesheet of your choice. This means however that in order for the components to be styled properly, you must link to a stylesheet yourself.
For convenience, links to BootstrapCDN for each theme are available through the themes module, which can be used as follows:
For more information on how to link local or external CSS, check out the Dash documentation.
Build the layout
With CSS linked, you can start building your app’s layout with our Bootstrap components. See our documentation for a full list of available components.
Contributing
We welcome contributions to dash-bootstrap-components. If you find a bug or something is unclear please submit a bug report, if you have ideas for new features please feel free to make a feature request. If you would like to submit a pull request, please read our contributing guide.
Copyright and license
Code and documentation is copyright Faculty Science Ltd. 2018-2022, and released under the Apache 2.0 license
Saved searches
Use saved searches to filter your results more quickly
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.
Bootstrap components for Plotly Dash
License
facultyai/dash-bootstrap-components
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Name already in use
A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Sign In Required
Please sign in to use Codespaces.
Launching GitHub Desktop
If nothing happens, download GitHub Desktop and try again.
Launching GitHub Desktop
If nothing happens, download GitHub Desktop and try again.
Launching Xcode
If nothing happens, download Xcode and try again.
Launching Visual Studio Code
Your codespace will open once ready.
There was a problem preparing your codespace, please try again.
Latest commit
Git stats
Files
Failed to load latest commit information.
README.md
Dash Bootstrap Components
dash-bootstrap-components is a library of Bootstrap components for use with Plotly Dash, that makes it easier to build consistently styled Dash apps with complex, responsive layouts.
You can install dash-bootstrap-components with pip :
pip install dash-bootstrap-components
You can also install dash-bootstrap-components with conda through the conda-forge channel:
conda install -c conda-forge dash-bootstrap-components
To use dash-bootstrap-components you must do two things:
- Link a Bootstrap v5 compatible stylesheet
- Incorporate dash-bootstrap-components into your layout
dash-bootstrap-components doesn’t come with CSS included. This is to give you the freedom to use any Bootstrap v5 stylesheet of your choice. This means however that in order for the components to be styled properly, you must link to a stylesheet yourself.
For convenience, links to BootstrapCDN for each theme are available through the themes module, which can be used as follows:
import dash import dash_bootstrap_components as dbc app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
For more information on how to link local or external CSS, check out the Dash documentation.
With CSS linked, you can start building your app’s layout with our Bootstrap components. See our documentation for a full list of available components, which include:
Standard row and column-based layouts
Quickstart
You can install dash-bootstrap-components with pip :
pip install dash-bootstrap-components
Anaconda
You can also install dash-bootstrap-components with conda through the conda-forge channel:
conda install -c conda-forge dash-bootstrap-components
Basic usage
dash-bootstrap-components is a component library for use with Plotly Dash. If you have not used Dash before, it’s strongly recommended you check out the Dash documentation and try building a basic app first.
To use dash-bootstrap-components you must do two things:
- Link a Bootstrap v5 compatible stylesheet
- Incorporate dash-bootstrap-components into the layout of your app.
Linking a stylesheet
dash-bootstrap-components doesn’t come with CSS included. This is to give you the freedom to use any Bootstrap v5 stylesheet of your choice. This means however that in order for the components to be styled properly, you must link to a stylesheet yourself.
For convenience, CDN links to JSDelivr for standard Bootstrap and each Bootswatch theme are available as part of dash-bootstrap-components within the dbc.themes submodule and can be used when instantiating the app object.
import dash import dash_bootstrap_components as dbc app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
For more information on available themes see the themes documentation
Build the layout
With CSS linked, you can start building your app’s layout with our Bootstrap components. See the component documentation for a full list of available components, or try running this minimal example to get started.
import dash import dash_bootstrap_components as dbc app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP]) app.layout = dbc.Container( dbc.Alert("Hello Bootstrap!", color="success"), className="p-5", ) if __name__ == "__main__": app.run_server()
Examples
Check out these example apps made with dash-bootstrap-components.