Library Comparison
Comparisons are tough. Differences in problem space, constraints, values, trade-offs, and a whole bunch of other factors come into play that make a true comparison complicated.
Mdash hits the sweet spot of minimal trade-offs and maximum value by relentlessly leveraging standards and offers developers a UI library that is extremely small and compatible, truly easy (no install, no config, no build step), more familiar, and is sophisticated enough to serve as a shared design system across large organizations.
So, although not every UI library has all the same components, those that have matches with Mdash have their markup lined up below to compare.
Submit correctionsBootstrapv4.5 72kb
M-v1.6.0 6kb
Container
Container (same loc, +9 chars)
Grid
Grid (same loc, -18 chars)
Accordion
body
Body
Accordion (-10 loc, -874 chars)
Summary
Details
Summary
Details
Alert
A dismissible warning alert.
Alert (-4 loc, -219 chars)
Badge
Badge (same loc, -13 chars)
Breadcrumb
Breadcrumb (same loc, -73 chars)
Card
Content
Box (-2 loc, -66 chars)
Collapse
Details
Details (a native element, same loc, -153 chars)
Summary
Details
Modal
Dialog (-11 loc, -473 chars)
Title
Content
Form
Form (-2 loc, -306 chars)
Icon (installed separately)
Icon (-2 loc, -84 chars)
Tabs
Tabs (-4 loc, -376 chars
Material Webv7.0 80kb
M-v1.6.0 6kb
Grid
Grid (-2 loc, -338 chars)
Dialog
Title
Content
Dialog (-11 loc, -504 chars)
Title
Content
Removable Chip
Text
cancel
Removable Tag (-12 loc, -465 chars)
Tabs
Tabs (-22 loc, -1,159 chars)
Zurb Foundationv6.6 87kb
M-v1.6.0 6kb
Grid
Grid (same loc, -36 chars)
Reveal
Title
Content
Dialog (-3 loc, -192 chars)
Title
Content
Accordion
Accordion (-4 loc, -305 chars)
Summary
Details
Summary
Details
Dropdown
Content
Menu (+2 loc, -22 chars)
Content