Vue Skeleton - Modern Data-Loading Indicator Component

Overview

Vue Skeleton is a modern data-loading indicator that shows a preview of how the page is going to be displayed with a shimmer effect. It improves the user experience by informing users of ongoing processes.

• Vue Skeleton demo
• Vue Skeleton getting started documentation

Built-in themes

The Vue Skeleton supports built-in themes such as Tailwind CSS, Bootstrap 5, Bootstrap 4, Bootstrap, Material, Fabric, Fluent, and high contrast. Users can customize these built-in themes or create new themes to achieve the desired look and feel by simply overriding SASS variables or using the Theme Studio application.

• Theme Studio application

Vue Skeleton code example

Easily get started with the Vue Skeleton using a few simple lines of Vue code example as demonstrated below. Also explore our Vue Skeleton Example that shows you how to render and configure the Vue Skeleton.

<template>
    <ejs-skeleton height='15px' shape="Circle"></ejs-skeleton >
</template>

<script>
import Vue from 'vue';
import { SkeletonPlugin } from "@syncfusion/ej2-vue-notifications";

Vue.use(SkeletonPlugin);

export default { }
</script>

Other supported frameworks

The Skeleton component is also available in Blazor, Angular, React, and JavaScript frameworks. Check out the component on other platforms using these links:

• Blazor Skeleton

• Angular Skeleton

• React Skeleton

• JavaScript Skeleton