mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
94 lines
5.6 KiB
Markdown
94 lines
5.6 KiB
Markdown
# [Bulma](https://bulma.io)
|
|
|
|
Bulma is a **modern CSS framework** based on [Flexbox](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes).
|
|
|
|
<a target='_blank' rel='nofollow' href='https://app.codesponsor.io/link/5pucRKHwhsqiAiYS1CdnS4SM/jgthms/bulma'> <img alt='Sponsor' width='888' height='68' src='https://app.codesponsor.io/embed/5pucRKHwhsqiAiYS1CdnS4SM/jgthms/bulma.svg' /></a>
|
|
|
|
[](https://www.npmjs.com/package/bulma)
|
|
[](https://www.npmjs.com/package/bulma)
|
|
[](https://gitter.im/jgthms/bulma)
|
|
[](https://travis-ci.org/jgthms/bulma)
|
|
|
|
<a href="https://bulma.io"><img src="https://raw.githubusercontent.com/jgthms/bulma/master/docs/images/bulma-banner.png" alt="Bulma: a Flexbox CSS framework" style="max-width:100%;" width="600" height="315"></a>
|
|
|
|
## Quick install
|
|
|
|
Bulma is constantly in development! Try it out now:
|
|
|
|
### NPM
|
|
|
|
```sh
|
|
npm install bulma
|
|
```
|
|
**or**
|
|
|
|
### Yarn
|
|
|
|
```sh
|
|
yarn add bulma
|
|
```
|
|
|
|
### Bower
|
|
|
|
```sh
|
|
bower install bulma
|
|
```
|
|
|
|
### CDN
|
|
|
|
[https://cdnjs.com/libraries/bulma](https://cdnjs.com/libraries/bulma)
|
|
|
|
Feel free to raise an issue or submit a pull request.
|
|
|
|
## CSS only
|
|
|
|
Bulma is a **CSS** framework. As such, the sole output is a single CSS file: [bulma.css](https://github.com/jgthms/bulma/blob/master/css/bulma.css)
|
|
|
|
You can either use that file, "out of the box", or download the Sass source files to customize the [variables](https://bulma.io/documentation/overview/variables/).
|
|
|
|
There is **no** JavaScript included. People generally want to use their own JS implementation (and usually already have one). Bulma can be considered "environment agnostic": it's just the style layer on top of the logic.
|
|
|
|
## Browser Support
|
|
|
|
Bulma uses [autoprefixer](https://github.com/postcss/autoprefixer) to make (most) Flexbox features compatible with earlier browser versions. According to [Can I use](https://caniuse.com/#feat=flexbox), Bulma is compatible with **recent** versions of:
|
|
|
|
* Chrome
|
|
* Edge
|
|
* Firefox
|
|
* Opera
|
|
* Safari
|
|
|
|
Internet Explorer (10+) is only partially supported.
|
|
|
|
## Documentation
|
|
|
|
The documentation resides in the [docs](docs) directory, and is built with the Ruby-based [Jekyll](https://jekyllrb.com/) tool.
|
|
|
|
Browse the [online documentation here.](https://bulma.io/documentation/overview/start/)
|
|
|
|
## Related projects
|
|
|
|
| Project | Description |
|
|
|------------------------------------------------------------------------------------|--------------------------------------------------------------------|
|
|
| [Bulma with Attribute Modules](https://github.com/j5bot/bulma-attribute-selectors) | Adds support for attribute-based selectors. |
|
|
| [Bulma with Rails](https://github.com/joshuajansen/bulma-rails) | Integrates Bulma with the rails asset pipeline |
|
|
| [Vue Admin](https://github.com/vue-bulma/vue-admin) | Vue Admin framework powered by Bulma |
|
|
| [Bulmaswatch](https://github.com/jenil/bulmaswatch) | Free themes for Bulma |
|
|
| [Goldfish](https://github.com/Caiyeon/goldfish) | Vault UI with Bulma, Golang, and Vue Admin |
|
|
| [ember-bulma](https://github.com/open-tux/ember-bulma) | Ember addon providing a collection of UI components for Bulma |
|
|
| [Bloomer](https://bloomer.js.org) | A set of React components for Bulma |
|
|
| [Re-bulma](https://github.com/bokuweb/re-bulma) | Bulma components build with React |
|
|
| [React-bulma](https://github.com/kulakowka/react-bulma) | React.js components for Bulma |
|
|
| [Buefy](https://buefy.github.io) | Lightweight UI components for Vue.js based on Bulma |
|
|
| [vue-bulma-components](https://github.com/vouill/vue-bulma-components) | Bulma components for Vue.js with straightforward syntax |
|
|
| [BulmaJS](https://github.com/VizuaaLOG/BulmaJS) | Javascript integration for Bulma. Written in ES6 with a data-* API |
|
|
| [Bulma.styl](https://github.com/log1x/bulma.styl) | 1:1 Stylus translation of Bulma |
|
|
| [elm-bulma-classes](https://github.com/danielnarey/elm-bulma-classes) | Bulma prepared for usage with ELM |
|
|
| [Bulma Customizer](https://bulma-customizer.bstash.io/) | Bulma Customizer – Create your own **bespoke** Bulma build |
|
|
| [Fulma](https://mangelmaxime.github.io/Fulma/) | Wrapper around Bulma for [fable-react](https://github.com/fable-compiler/fable-react) |
|
|
| [Laravel Enso](https://github.com/laravel-enso/enso) | SPA Admin Panel built with Bulma, VueJS and Laravel |
|
|
|
|
## Copyright and license
|
|
|
|
Code copyright 2017 Jeremy Thomas. Code released under [the MIT license](https://github.com/jgthms/bulma/blob/master/LICENSE).
|