Press "Enter" to skip to content

Lightweight UI Components for Vue.js Based on Bulma | Buefy

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

vue ui components, vuetify, primevue, vue ui component library, best vue component library, vue 3 ui components, vue ui kit

Features

  • Easily keep your current theme/variants of Bulma
  • Supports both Material Design icons and FontAwesome
  • Extremely lightweight with no internal dependencies unlike Vue & Bulma
  • Approx. 88 KB min + gzip (with Bulma)
  • Semantic code output
  • Follows Bulma’s design and some UX Material Design
  • Focus on usability and performance without overburdening things

How to make use of it:

1. Install via npm.

npm install buefy

2. Import and use Buefy.

import Vue from 'vue';
import Buefy from 'buefy';
import 'buefy/dist/buefy.css';

Vue.use(Buefy);
import Vue from 'vue'
import { Field, Input } from 'buefy'
import 'buefy/dist/buefy.css'

Vue.use(Field)
Vue.use(Input)

3. Include material design icons.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@5.8.55/css/materialdesignicons.min.css">

4. Alternatively, you can use a CDN or even a download.

<!-- Buefy CSS -->
<link rel="stylesheet" href="https://unpkg.com/buefy/dist/buefy.min.css">

<!-- Buefy JavaScript -->
<script src="https://unpkg.com/buefy/dist/buefy.min.js"></script>

Lightweight UI Components For Vue.js, Buefy Plugin/Github


See Demo And Download

Official Website(buefy): Click Here

This superior jQuery/javascript plugin is developed by buefy. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published.