VuiBox
The VuiBox
component is a wrapper component which provides different CSS utlities for styling the elements. It uses MUI Box
in base and you can use all of the props from MUI Box
for the VuiBox
component.
Its one of the most powerful components that give you all of the possibilites for providing styles for an element directly in JSX.
The below codes are editable and you can modify them the way you want directly from your browser, please use the green button or the ctrl + s to save the changes.
Demo
// Vision UI Dashboard React components
import VuiBox from "components/VuiBox";
Box
Props Information
Name | Type | Default | Description |
---|---|---|---|
bgColor | string | transparent | Change the VuiBox background color. |
color | string | dark | Change the VuiBox text color. |
variant | 'gradient''contained' | contained | Change the VuiBox background type. |
opacity | number | 1 | Change the VuiBox opacity. |
borderRadius | string | none | Set a border radius for the VuiBox . |
shadow | string | none | Set a box shadow for the VuiBox . |
MUI Props | You can pass all of the MUI System Properties for the VuiBox as well. |