/buefy

Lightweight UI components for Vue.js based on Bulma

Primary LanguageCSSMIT LicenseMIT

Buefy

npm npm npm

Buefy is a lightweight library of responsive UI components for Vue.js based on Bulma framework and design.

Buefy

Features

  • Keep your current Bulma theme / variables easily

  • Supports both Material Design Icons and FontAwesome

  • Very lightweight with none internal dependencies aside from Vue & Bulma

  • Semantic code output

  • Follows Bulma design and some of the Material Design UX

  • Focus on usability and performance without over-animations

Documentation and Demo

The documentation is in the docs directory, it serves as the demo as well.

Browse the online documentation here.

Quick Start

Install via npm

npm install buefy

Import and use Buefy. You can also enable individual components:

import Vue from 'vue'
import Buefy from 'buefy'
import 'buefy/lib/buefy.css'

Vue.use(Buefy)

// OR

Vue.component(Buefy.Checkbox.name, Buefy.Checkbox)
Vue.component(Buefy.Table.name, Buefy.Table)
...

Include Material Design Icons

<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">

Note: If you want to customize the icons or the theme, access the customization section on the online documentation.

Browser Support

  • Firefox 52+
  • Chrome 57+
  • Edge 38+
  • Opera 44+
  • Safari (needs testing)
  • Internet Explorer (not working)

Credits and Thanks

Copyright and License

Copyright (c) 2017 Rafael Beraldo. Code released under the MIT license.


Twitter @rafaelpimpa