Vuejs UI Layout Resources

Magic Grid A simple, lightweight Javascript library for dynamic grid layouts. Creating a dynamic grid layout has never been easier. With Magic Grid, a

Splitpanes A Vue.js reliable, simple and touch-ready panes splitter / resizer. Vue 3 compatible. Installation npm i splitpanes Vue 3 npm i splitpanes

slidev-theme-academic Simplifies creating academic presentations with Slidev by providing the necessary components and layouts. Install Add the follow

vue-masonry-wall A pure vue responsive masonry implementation without direct dom manipulation, ssr friendly with lazy appending. I created this becaus

Nova Grid This Laravel Nova package allows you to create simple input filters. Requirements php: =8.0 laravel/nova: ^4.0 Features -size() helpers th

vue-virtual-scroller Blazing fast scrolling of any amount of data | Live demo | Video demo Sponsors Table of contents Installation Usage RecycleScroll

vue-grid-layout Documentation Website What is Vue Grid Layout? vue-grid-layout is a grid layout system, like Gridster, for Vue.js. Heavily inspired by

vue-breakpoints Vue.js utility component to show and hide components based on breakpoints 📺 Demo 🔧 Install npm i vue-breakpoints yarn add vue-breakp

vue-breakpoints Vue.js utility component to show and hide components based on breakpoints 📺 Demo 🔧 Install npm i vue-breakpoints yarn add vue-breakp

Command Palette for Vue A fast, composable, unstyled command + k interface (Command Palette) for Vue. Preview Concepts Command palette interfaces are

Table of contents Advantages Live demo Simple usage Props type Required props Optional props Public methods Attentions Advantages Only 3 required prop

vue-grid-layout Documentation Website What is Vue Grid Layout? vue-grid-layout is a grid layout system, like Gridster, for Vue.js. Heavily inspired by

vue-fabric-wrapper Stick Man Example: Currently implemented the following Fabric Objects: Fabric.Canvas, Fabric.Circle, Fabric.Ellipse, Fabric.Group,

vue-masonry Current version: 0.12.0 Vue.js directive for masonry blocks layouting. Original masonry library. Plugin DEMO available 🎉 , JSFiddle DEMO

A pack of Vue components that solve daily layout problems

vue-waterfall A waterfall layout component for Vue.js . Branch 0.x (version 0.x.x) is compatible with Vue 1 . Demo Vertical line Horizontal line Verti

Layoutit grid is a CSS Grid layout generator. Quickly draw down web pages layouts with our clean editor, and get HTML and CSS code to quickstart your next project.

CSS Grid Generator Site: https://cssgrid-generator.netlify.com/ This project is a way for people to use CSS Grid features quickly to create dynamic la

With more than 85 components, over 45 available plugins, several directives, and 1000+ icons, BootstrapVue provides one of the most comprehensive impl

vue-golden-layout Integration of the golden-layout to Vue Installation npm i -S vue-golden-layout Fast example golden-layout gl-row gl-comp

Be Cool with Vue@^2.3.0 and WeUI. Live Demo Sponsors 我们的产品 Requirements 暂未适配 vue-cl[email protected]，请注意。 vue@^2.3.0(for .sync modifier) webpack@^2.0 node@^7.6

Popular layouts and patterns made with Tailwind CSS

WP Vue This is just a simple Vue application (scaffolded using the Vue CLI) that pulls posts from a WordPress REST API endpoint. Clone or fork this su

vue-smart-widget Smart widget is a flexible and extensible content container component. It includes header and body part, and widget body includes edi

Challenge-Resposive-Web-Design-in-300hr Things that you must learn about it to run on road front-end world. In this Responsive Web Design challenge, y

Attention I'm very sorry about the lack of concern about this library Recently. So busy in doing other things and I have no time to maintain it. I wil

Vue-fullpage.js Official Vue.js wrapper for the fullpage.js library. Demo online | Codepen fullpage.js Extensions By @imac2. Thanks to VasiliyGryaznoy

VueResponsiveGridLayout 1.2.0 Responsive draggable and resizable grid layout for VueJS. Its responsiveness is based on breakpoints (similar to Bootstr

Vue.js Grid ( Experiment ) ⚠️ This an experement and not a production-ready plugin Fixed size grid for Vue.js This is very a first version of the plug

Vue.js 2.x responsive grid system with smooth sorting, drag-n-drop and reordering

autoresponsive-vue Auto responsive grid layout library for Vue. Examples Live demo & docs: xudafeng.github.io/autoresponsive-vue Installation $ npm i

autoresponsive-vue Auto responsive grid layout library for Vue. Examples Live demo & docs: xudafeng.github.io/autoresponsive-vue Installation $ npm i

vue-responsive-dash A Responsive, Draggable & Resizable Dashboard (grid) made with vue and typescript. Inspired by React-Grid-Layout & Vue-Grid-Layout

Vue Virtual Grid Virtual Scrolling Grid made for VueJS based on CSS grids. NPM Package | Demo Website Render any Vue Component (images, iframes, conte

Grace - Design System For Vue Applications

A new masonry component powered by CSS to be fast loading and free of jQuery or other dependencies. Build specifically for Vue.js projects. 😎 Why? Ex

A new masonry component powered by CSS to be fast loading and free of jQuery or other dependencies. Build specifically for Vue.js projects. 😎 Why? Ex

vue-virtual-collection Vue component for efficiently rendering large collection data. Inspired by react-virtualize. Demo Table of Contents generated w

vue-virtual-collection Vue component for efficiently rendering large collection data. Inspired by react-virtualize. Demo Table of Contents generated w

The Ultimate fully-customizable plugin for skeleton cards in Vue. It's a no-brainer.

Ant Design Vue Pro Layout This template should help get you started developing with Vue 3 and Ant Design Vue 2 in Vite. Recommended IDE Setup VSCode +

vue-bulma-components The goal of this library is to use the bulma class syntax as components and props. 3kb minified Demo and try the live demo too :)

👋 You might want to use Vue Horizontal instead! Vue Horizontal is another take on the horizontal layout written by me with an ultra simple implementa

vue3-win10 Vue3 仿Win10 UI 框架 推荐 Vue 3 + Typescript + Vite + Using script setup 文档|官网|Demo 本框架可以让你的页面像win10视窗系统一样，变为一个网页上的win10系统。 Demo|Demo|Demo Usa

vue3-win10 Vue3 仿Win10 UI 框架 推荐 Vue 3 + Typescript + Vite + Using script setup 文档|官网|Demo 本框架可以让你的页面像win10视窗系统一样，变为一个网页上的win10系统。 Demo|Demo|Demo Usa

Vue Splitter Pane Demo vue-splitter-pane is a Vuejs component which renders two slots in a adjustable split arrangement (vetical or horizontal). Uses

vue-extend-layout A simple extend the default layout or create custom layouts for your SPA Vue.js, using dynamic import component. For vue-extend-layo

vue-extend-layout A simple extend the default layout or create custom layouts for your SPA Vue.js, using dynamic import component. For vue-extend-layo

Vue.Isotope Vue component (Vue.js 2.0) or directive (Vue.js 1.0) allowing isotope layout including filtering and sorting. Motivation Integrate Vue wit

Responsive masonry layout with SSR support and zero dependencies for Vue 3.

An ultra simple pure vue horizontal layout for modern responsive web with zero dependencies. (SPA/SSG/SSR)

vue-ads-layout This is a vue component library to create a default web application layout. You can create a toolbar, footer, left and right drawers. A

simple-grid a simple grid layout(Vue Component) Installation use npm $ npm i simple-xgrid --save import Grid from 'simple-xgrid' import 'simple-xgrid

vue-grd Simple, Light-weight and Flexible Vue.js component for grid layout. Vue.js port of grd. Install npm install --save vue-grd Usage You can use