Examples
Functional examples of using Bootstrap in common JS frameworks like Webpack, Parcel, Vite, and more!
Install / Use
/learn @twbs/ExamplesREADME
<p align="center">
<a href="https://getbootstrap.com/">
<img src="https://getbootstrap.com/docs/5.3/assets/brand/bootstrap-logo-shadow.png" alt="Bootstrap logo" width="200" height="165">
</a>
</p>
<h3 align="center">Bootstrap Examples</h3>
<p align="center">
Functional examples for building with Bootstrap using popular tools and frameworks.
<br>
<a href="https://getbootstrap.com/docs/"><strong>Explore Bootstrap docs »</strong></a>
</p>
Directory
- Starter – CDN links for our CSS and JS
- Sass & JS — Import Sass, Autoprefixer, Stylelint, and our JS bundle via npm
- Sass & ESM JS — Import Sass, Autoprefixer, and Stylelint via npm, and then load our ESM JS with a shim
- Color modes – Color mode support and color mode picker built on our Sass & ESM JS example
- Bootstrap Icons font - Import and compile Sass, Stylelint, PurgeCSS, and our icon font
- Parcel - Sass, JS via Parcel
- React - Sass with React Bootstrap components using React and Next.js
- Vite - Sass, JS via Vite
- Vue - Sass, JS via Vue/Vite
- Webpack - Import and bundle Sass and JS with Webpack
- PurgeCSS - import sass w/ purgecss and js via npm
License
Licensed under the MIT License.
Related Skills
node-connect
342.5kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
85.3kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
342.5kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
qqbot-media
342.5kQQBot 富媒体收发能力。使用 <qqmedia> 标签，系统根据文件扩展名自动识别类型（图片/语音/视频/文件）。
