Skip to content

Introduction

What is VBox?

VBox provides a polymorphic component that accepts CSS properties as attributes, along with props for responsive design, dark mode, pseudo-states, keyframes, etc. Under the hood, it generates CSS rules and injects the styles into the DOM.

vue
<template>
  <v-box
    is="p"
    text-align="center"
    padding="1rem"
    color="#fff"
    background-color="#000"
    :dark="{
      backgroundColor: '#fff',
      color: '#000',
    }"
    >Hello world 🎉</v-box
  >
</template>

Hello world 🎉