A wider screen, please

This page features interactive demos and side-by-side code samples that need at least 340 pixels of horizontal space. Please widen your browser window, or rotate your device, to continue.

Morpheus v0.3.0
v0.3.0
Morpheus Bundle builder Settings
v0.3.0 (latest)v0.2.0main (unreleased)Enable all Disable allalertauraavataravatarsbadgeboundarybreadcrumbbuttonbuttongroupcardcarouselcheckboxclipcopycolor-fieldcomboboxcontextmenudatalistdialogdrawerelasticiconif-networkif-platforminput-groupkbdkeyslayoutlightboxlinkmenunavgrouppaginationpersistpopoverprogressradio-groupratingresizablerevealableselectsidebarskeletonsliderslider-rangesortablespinnerswitchtabstextareatextinputtoastertoggletoggle-grouptooltiptree

Bundle size

Building bundle…

Uncompressedgzip

Level 6, the gzip default. Level 9 saves under 1% more.

brotli

Quality 11, the maximum, as used for precompressed files. On-the-fly compression uses a lower quality and produces larger files.

- --
- --
- --
- --
- --
- --
- --
- --
- --
Total- --

The components and the other themes need theme-default.css.

Download morpheus.zip

Built in your browser with esbuild.

Command line#

The morpheus command builds the same files without a browser. It needs Go, and the version after @ selects the release it builds:

-components takes the names on this page, comma-separated, and adds the components they require. The command writes morpheus.min.js, morpheus.min.css and theme-default.css to the -o directory and prints their sizes. -themes takes theme names, such as default,rose, or none. With -json it prints the result as JSON, and with -unminified it also writes morpheus.js and morpheus.css.

In a Go module, add the command as a tool. It then builds the version the module requires, which the neo and datastar packages come from:

morpheus components lists the names with the components each requires, and morpheus bundle -h lists the flags.

Settings

Theme

DefaultSunshineOceanMatrixRose☀ ◐ ☾

Accessibility

Playgrounds

Server Simulator