Sheet

The v-sheet is designed to power other paper components within Vuetify. It is meant to be used as a low level component.

Usage

The v-sheet component is a malleable piece of paper that can be morphed to facilitate other components. In this example we utilize custom color, theme (dark/light) and size.

API

v-sheet
Name
color
Default
undefined
Type
string

コンポーネントに色を設定します。この色は、定義されている色の名前(例えばsuccesspurple)や、CSSの色指定(#033rgba(255, 0, 0, 0.5))を設定できます。

Name
dark
Default
false
Type
boolean

ダークテーマを適用します。

Name
elevation
Default
undefined
Type
number | string

Components.Sheets.

Name
height
Default
undefined
Type
number | string

Components.Sheets.

Name
light
Default
false
Type
boolean

ライトテーマを適用します。

Name
max-height
Default
undefined
Type
number | string

Components.Sheets.

Name
max-width
Default
undefined
Type
number | string

Components.Sheets.

Name
min-height
Default
undefined
Type
number | string

Components.Sheets.

Name
min-width
Default
undefined
Type
number | string

Components.Sheets.

Name
tag
Default
div
Type
String

Components.Sheets.

Name
tile
Default
false
Type
Boolean

Components.Sheets.

Name
width
Default
undefined
Type
number | string

Components.Sheets.

Examples

Using elevation

Sheets can accept a custom elevation between 0 and 24 (0 is default).

Edit this page | language on Github
Vuetify 3 is now available!The latest version of Vuetify is now available!
Learn about Vuetify 3's new features and functionality for modern Vue applications
Start exploringExplore