Svelte Material UI

Paper

Installation
npm i -D @smui/paper
Demos
Paper
This is a sheet of paper.
Paper is used to build an elevated surface.
Unelevated Paper
This is an unelevated sheet of paper.
Unelevated paper is used to build a surface.
Outlined Paper
This is an outlined sheet of paper.
Outlined paper is used to build a container.
Square paper
Square Paper
By adding the square property, the paper gains sharper corners and can be used to intimidate foes.
Unelevated Square Paper
Unelevated square paper is pretty much a sheet of paper embedded in the floor.
Outlined Square Paper
Outlined square paper... is it really paper anymore?
Primary color
Primary Paper
Paper can have a color, allowing you to construct fancy school projects with the colored paper and glue sticks.
Unelevated Primary Paper
Unelevated primary paper is nice because it will pretty much always stand out, even in light mode.
Outlined Primary Paper
Outlined primary paper has a neat border.
Outlined Primary Paper with Primary Text
Outlined primary paper with primary color text. For the times when you need to draw attention.
Secondary color
Secondary Paper
Paper can have a color, allowing you to construct fancy school projects with the colored paper and glue sticks.
Unelevated Secondary Paper
Unelevated secondary paper is nice because it will pretty much always stand out, even in light mode.
Outlined Secondary Paper
Outlined secondary paper has a neat border.
Outlined Secondary Paper with Secondary Text
Outlined secondary paper with secondary color text. For the times when you need to draw attention.
Colored (using Sass mixins)
Custom Color Paper
Paper can have a color, allowing you to construct fancy school projects with the colored paper and glue sticks.
Unelevated Custom Color Paper
Unelevated custom color paper is nice because it will pretty much always stand out, even in light mode.
Outlined Custom Color Paper
Outlined custom color paper has a neat border.
Outlined Custom Color Paper with Custom Color Text
Outlined custom color paper with custom color color text. For the times when you need to draw attention.
Elevation and transition
Elevated Paper
If you add the transition property, elevation changes will animate.