perish design

A living Svelte vocabulary for the workshop. Inspect each word in isolation, then shape it without leaving the page.

content

Badge

preview

props

childrenthe short label to carry

Code

preview

props

childrenthe source text to displaynamean optional file name shown abovecopyshow a copy control

Ledger

preview

props

atomsfixed examplethe word and count pairs to tally

List

preview

props

childrenthe list items

Note

preview

props

textthe message to showtonecalm or warning emphasis

Tag

preview

props

textthe short tag texttonecalm or warning emphasis

control

Button

preview

props

childrenthe label inside the buttonlabela text label when children are absent

pressfncalled when the button is pressed

tonesolid or quiet visual emphasiswidefill the available widthbusydisable the button while work is runningsubmitsubmit the nearest form

Copy

preview

props

textthe text placed on the clipboard

Field

preview

props

labelthe field labelvaluethe current field value

changefncalled with the next field value

kindplain text or password inputhintoptional placeholder text

Forge

preview

props

repothe owner and name of a repository

Link

preview

props

labelthe visible link texthrefthe link destination

Search

preview

props

valuethe current query text

changefncalled with the next query text

hintoptional placeholder text

layout

Card

preview

props

titlethe heading of the cardchildrenthe body of the card

Frame

preview

props

childrenthe whole page inside the shell

Grid

preview

props

childrenthe cells to lay out

Hero

preview

props

titlethe largest line on the pagetextone line under the titlemarkan optional glyph beside the title

Line

preview

props

namethe primary row textmetaoptional secondary textchildrenoptional controls or tags on the far side

Nav

preview

props

childrenthe navigation contents

Rail

preview

props

stopsfixed examplethe ordered stops along the rail

Split

preview

props

childrenthe contents placed at opposite sides

surface

Board

preview

props

titlethe board headingbriefoptional supporting text under the headingchildrenthe rows and controls inside the board

Page

preview

props

titlethe page headingchildrenthe page contents

Sheet

preview

props

childrenthe controls and copy on the bounded surface

Shell

preview

props

childrenthe complete product surface

perish design

content

Badge

Code

Ledger

List

Note

Tag

control

Button

Copy

Field

Forge

Link

Search

layout

Banner

Card

Footer

Frame

Grid

Hero

Line

Nav

Rail

Split

surface

Board

Page

Sheet

Shell