PageSourceSearch

https://sveltematerialui.com/

html sveltematerialui.com collected 2026-10-02 05:12:27 UTC 65,689 bytes, 255 lines download raw bytes

1<!doctype html>
2<html prefix="og: http://ogp.me/ns#" lang="en">
3  <head>
4    <meta charset="utf-8" />
5    <meta
6      name="description"
7      content="Material UI Components for Svelte, ready to use in your app."
8    />
9
10    <!-- Open Graph data -->
11    <meta property="og:title" content="Svelte Material UI" />
12    <meta property="og:url" content="https://sveltematerialui.com/" />
13    <meta
14      property="og:image"
15      content="https://sveltematerialui.com/header.png"
16    />
17    <meta
18      property="og:description"
19      content="Material UI Components for Svelte, ready to use in your app."
20    />
21    <meta property="og:type" content="website" />
22
23    <!-- Icons -->
24    <link
25      rel="apple-touch-icon"
26      sizes="57x57"
27      href="./icons/apple-icon-57x57.png"
28    />
29    <link
30      rel="apple-touch-icon"
31      sizes="60x60"
32      href="./icons/apple-icon-60x60.png"
33    />
34    <link
35      rel="apple-touch-icon"
36      sizes="72x72"
37      href="./icons/apple-icon-72x72.png"
38    />
39    <link
40      rel="apple-touch-icon"
41      sizes="76x76"
42      href="./icons/apple-icon-76x76.png"
43    />
44    <link
45      rel="apple-touch-icon"
46      sizes="114x114"
47      href="./icons/apple-icon-114x114.png"
48    />
49    <link
50      rel="apple-touch-icon"
51      sizes="120x120"
52      href="./icons/apple-icon-120x120.png"
53    />
54    <link
55      rel="apple-touch-icon"
56      sizes="144x144"
57      href="./icons/apple-icon-144x144.png"
58    />
59    <link
60      rel="apple-touch-icon"
61      sizes="152x152"
62      href="./icons/apple-icon-152x152.png"
63    />
64    <link
65      rel="apple-touch-icon"
66      sizes="180x180"
67      href="./icons/apple-icon-180x180.png"
68    />
69    <link
70      rel="icon"
71      type="image/png"
72      sizes="192x192"
73      href="./icons/android-icon-192x192.png"
74    />
75    <link
76      rel="icon"
77      type="image/png"
78      sizes="32x32"
79      href="./icons/favicon-32x32.png"
80    />
81    <link
82      rel="icon"
83      type="image/png"
84      sizes="96x96"
85      href="./icons/favicon-96x96.png"
86    />
87    <link
88      rel="icon"
89      type="image/png"
90      sizes="16x16"
91      href="./icons/favicon-16x16.png"
92    />
93    <link rel="manifest" href="./manifest.json" />
94    <meta name="msapplication-TileColor" content="#ffffff" />
95    <meta
96      name="msapplication-TileImage"
97      content="./ms-icon-144x144.png"
98    />
99    <meta name="theme-color" content="#ffffff" />
100
101    <!-- Fonts and CSS -->
102
103    <!-- Hint where we get fonts from. -->
104    <link rel="preconnect" href="https://fonts.googleapis.com" />
105    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
106
107    <!-- Material Icons, Roboto, and Roboto Mono fonts -->
108    <link
109      href="https://fonts.googleapis.com/css2?family=Material+Icons&Roboto+Mono:ital@0;1&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
110      rel="stylesheet"
111    />
112
113    <!-- Highlight.js Theme (For Markdown Pages) -->
114    <link
115      rel="stylesheet"
116      href="https://cdn.jsdelivr.net/npm/[email protected]/styles/obsidian.css"
117    />
118
119    <meta name="viewport" content="width=device-width, initial-scale=1" />
120
121    <style>
122      html,
123      body {
124        margin: 0;
125        padding: 0;
126      }
127    </style>
128
129    <link href="./_app/immutable/entry/start.CrBwZ__W.js" rel="modulepreload">
130		<link href="./_app/immutable/chunks/BEce9HXa.js" rel="modulepreload">
131		<link href="./_app/immutable/chunks/Bf_DJP33.js" rel="modulepreload">
132		<link href="./_app/immutable/chunks/DyID_KVz.js" rel="modulepreload">
133		<link href="./_app/immutable/entry/app.C9dKaIEz.js" rel="modulepreload">
134		<link href="./_app/immutable/chunks/xihTtKlq.js" rel="modulepreload">
135		<link href="./_app/immutable/nodes/0.DXLf7NCn.js" rel="modulepreload">
136		<link href="./_app/immutable/chunks/EvgqFCLZ.js" rel="modulepreload">
137		<link href="./_app/immutable/chunks/JL0yVdW4.js" rel="modulepreload">
138		<link href="./_app/immutable/chunks/Dv4kbAvS.js" rel="modulepreload">
139		<link href="./_app/immutable/chunks/BXgRjqYv.js" rel="modulepreload">
140		<link href="./_app/immutable/chunks/BkjHx8cA.js" rel="modulepreload">
141		<link href="./_app/immutable/chunks/D_lCWsfQ.js" rel="modulepreload">
142		<link href="./_app/immutable/chunks/D7N2I7Df.js" rel="modulepreload">
143		<link href="./_app/immutable/chunks/CtjIQ59i.js" rel="modulepreload">
144		<link href="./_app/immutable/chunks/Ch__h6FN.js" rel="modulepreload">
145		<link href="./_app/immutable/chunks/CG61PKIU.js" rel="modulepreload">
146		<link href="./_app/immutable/chunks/PTETN2PC.js" rel="modulepreload">
147		<link href="./_app/immutable/chunks/DyaKBINf.js" rel="modulepreload">
148		<link href="./_app/immutable/nodes/2.TAUEXVrF.js" rel="modulepreload">
149		<link href="./_app/immutable/chunks/B_anq4TC.js" rel="modulepreload">
150		<link href="./_app/immutable/chunks/CnHWlhZi.js" rel="modulepreload">
151		<!--12qhfyh--><link rel="stylesheet" href="./smui.css" class="svelte-12qhfyh"/> <link rel="stylesheet" href="./site.css" class="svelte-12qhfyh"/> <!----><style>/*!
152  Theme: Material Darker
153  Author: Nate Peterson
154  License: ~ MIT (or more permissive) [via base16-schemes-source]
155  Maintainer: @highlightjs/core-team
156  Version: 2021.09.0
157*/pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#EEFFFF;background:#212121}.hljs::selection,
158.hljs ::selection{background-color:#353535;color:#EEFFFF}.hljs-comment{color:#4A4A4A}.hljs-tag{color:#B2CCD6}.hljs-subst,
159.hljs-punctuation,
160.hljs-operator{color:#EEFFFF}.hljs-operator{opacity:0.7}.hljs-bullet,
161.hljs-variable,
162.hljs-template-variable,
163.hljs-selector-tag,
164.hljs-name,
165.hljs-deletion{color:#F07178}.hljs-symbol,
166.hljs-number,
167.hljs-link,
168.hljs-attr,
169.hljs-variable.constant_,
170.hljs-literal{color:#F78C6C}.hljs-title,.hljs-class .hljs-title,.hljs-title.class_,.hljs-strong{color:#FFCB6B}.hljs-strong{font-weight:bold}.hljs-code,
171.hljs-addition,
172.hljs-title.class_.inherited__,
173.hljs-string{color:#C3E88D}.hljs-built_in,
174.hljs-doctag,
175.hljs-quote,
176.hljs-keyword.hljs-atrule,
177.hljs-regexp{color:#89DDFF}.hljs-function .hljs-title,
178.hljs-attribute,
179.ruby .hljs-property,
180.hljs-title.function_,
181.hljs-section{color:#82AAFF}.hljs-type,.hljs-template-tag,.diff .hljs-meta,.hljs-keyword,.hljs-emphasis{color:#C792EA}.hljs-emphasis{font-style:italic}.hljs-meta,
182.hljs-meta .hljs-keyword,
183.hljs-meta .hljs-string{color:#FF5370}.hljs-meta .hljs-keyword,
184.hljs-meta-keyword{font-weight:bold}.hljs-selector-id{color:#B2CCD6}.hljs-selector-class,.hljs-selector-attr,.hljs-selector-pseudo{color:#F07178}.hljs-params{color:#C792EA}.hljs-formula{color:#C3E88D}</style><!----> <!--[--><link rel="preload" href="./smui-material.css" as="style" class="svelte-12qhfyh"/> <link rel="preload" href="./smui-material-dark.css" as="style" class="svelte-12qhfyh"/><link rel="preload" href="./smui-fixation.css" as="style" class="svelte-12qhfyh"/> <link rel="preload" href="./smui-fixation-dark.css" as="style" class="svelte-12qhfyh"/><link rel="preload" href="./smui-muted.css" as="style" class="svelte-12qhfyh"/> <link rel="preload" href="./smui-muted-dark.css" as="style" class="svelte-12qhfyh"/><link rel="preload" href="./smui-bubblegum.css" as="style" class="svelte-12qhfyh"/> <link rel="preload" href="./smui-bubblegum-dark.css" as="style" class="svelte-12qhfyh"/><link rel="preload" href="./smui-metro.css" as="style" class="svelte-12qhfyh"/> <link rel="preload" href="./smui-metro-dark.css" as="style" class="svelte-12qhfyh"/><link rel="preload" href="./smui-unity.css" as="style" class="svelte-12qhfyh"/> <link rel="preload" href="./smui-unity-dark.css" as="style" class="svelte-12qhfyh"/><!--]--> <!--[2--><link rel="stylesheet" href="./smui-dark.css" media="screen and (prefers-color-scheme: dark)" class="svelte-12qhfyh"/> <link rel="stylesheet" href="./site-dark.css" media="screen and (prefers-color-scheme: dark)" class="svelte-12qhfyh"/><!--]--> <!--[0--><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/index.css" class="svelte-12qhfyh"/><!--]--><!----><!--1uha8ag--><!----><title>Svelte Material UI</title>
185		<link href="./_app/immutable/assets/0.Bm1AVxb4.css" rel="stylesheet">
186		<link href="./_app/immutable/assets/2.DexzmoZT.css" rel="stylesheet">
187
188    <!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 80 bytes, lines 188-191
188
189    <script
190      async
191      src="https://www.googletagmanager.com/gtag/js?id=
191G-79MKYND6TX
vendor: 21 bytes, lines 191-193
191"
192    ></script>
193    
193<script>
194      
vendor: 163 bytes, lines 194-200
194window.dataLayer = window.dataLayer || [];
195      function gtag() {
196        dataLayer.push(arguments);
197      }
198      gtag('js', new Date());
199
200      gtag('config', '
200G-79MKYND6TX
vendor: 8 bytes, lines 200-201
200');
201    
201</script>
201
202  </head>
203  <body class="ukraine transrights">
204    <div id="smui-app"><!--[--><!--[0--><!--[--><!--[-1--><header class="mdc-top-app-bar smui-top-app-bar--static demo-top-app-bar" style=""><!--[--><!--[-1--><!----><div class="mdc-top-app-bar__row"><section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start"><!--[-1--><!--]--> <!--[--><!--[-1--><!----><a class="mdc-top-app-bar__title mdc-theme--on-surface" href="/" style="color: inherit; "><!---->Svelte Material UI<!----><!----><!----><!----></a><!----><!--]--><!--]--><!----><!----></section><!----> <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar" style="color: var(--mdc-on-surface, #000);"><!--[!--><!--[--><!--[-1--><!----><a class="mdc-icon-button mdc-icon-button--display-flex mdc-top-app-bar__action-item" style="" href="https://github.com/hperrin/svelte-material-ui" title="SMUI on GitHub"><div class="mdc-icon-button__ripple"></div> <!--[0--><span class="mdc-icon-button__focus-ring"></span><!--]--> <!--[--><!--[0--><svg class="mdc-icon-button__icon" aria-hidden="true" focusable="false" tabindex="-1" viewBox="0 0 24 24"><path fill="currentColor" d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" class="svelte-12qhfyh"></path><!----><!----></svg><!--]--><!--]--><!----><!--[-1--><!--]--><!----><!----></a><!----><!--]--><!--]--><!--]--> <div style="display: inline-block;" class="svelte-12qhfyh"><!--[--><!--[-1--><!----><button class="mdc-icon-button mdc-icon-button--display-flex mdc-top-app-bar__action-item" style="" title="Pick a theme or toggle dark mode."><div class="mdc-icon-button__ripple"></div> <!--[0--><span class="mdc-icon-button__focus-ring"></span><!--]--> <!--[--><!--[0--><svg class="mdc-icon-button__icon" aria-hidden="true" focusable="false" tabindex="-1" viewBox="0 0 24 24"><path fill="currentColor" d="M17.5,12A1.5,1.5 0 0,1 16,10.5A1.5,1.5 0 0,1 17.5,9A1.5,1.5 0 0,1 19,10.5A1.5,1.5 0 0,1 17.5,12M14.5,8A1.5,1.5 0 0,1 13,6.5A1.5,1.5 0 0,1 14.5,5A1.5,1.5 0 0,1 16,6.5A1.5,1.5 0 0,1 14.5,8M9.5,8A1.5,1.5 0 0,1 8,6.5A1.5,1.5 0 0,1 9.5,5A1.5,1.5 0 0,1 11,6.5A1.5,1.5 0 0,1 9.5,8M6.5,12A1.5,1.5 0 0,1 5,10.5A1.5,1.5 0 0,1 6.5,9A1.5,1.5 0 0,1 8,10.5A1.5,1.5 0 0,1 6.5,12M12,3A9,9 0 0,0 3,12A9,9 0 0,0 12,21A1.5,1.5 0 0,0 13.5,19.5C13.5,19.11 13.35,18.76 13.11,18.5C12.88,18.23 12.73,17.88 12.73,17.5A1.5,1.5 0 0,1 14.23,16H16A5,5 0 0,0 21,11C21,6.58 16.97,3 12,3Z" class="svelte-12qhfyh"></path><!----><!----></svg><!--]--><!--]--><!----><!--[-1--><!--]--><!----><!----></button><!----><!--]--><!--]--><!----> <div class="mdc-menu-surface mdc-menu" style="" role="dialog"><!--[--><!--[-1--><!----><ul class="mdc-deprecated-list" role="menu"><li><ul class="mdc-menu__selection-group"><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item mdc-deprecated-list-item--selected mdc-menu-item--selected" style="" role="menuitem" aria-disabled="false" tabindex="0"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Follow System<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!----> <!--[--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Light<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Dark<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--]--><!----></ul></li><!----> <!--[--><!--[-1--><!----><li class="mdc-deprecated-list-divider" role="separator"><!----><!----></li><!----><!--]--><!--]--><!----> <li><ul class="mdc-menu__selection-group"><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item mdc-deprecated-list-item--selected mdc-menu-item--selected" style="" role="menuitem" aria-disabled="false" tabindex="0"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Svelte<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!----> <!--[--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Material<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Fixation<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Muted<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Bubblegum<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Metro<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--[--><!--[-1--><!----><li class="mdc-deprecated-list-item" style="" role="menuitem" aria-disabled="false" tabindex="-1"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><span class="mdc-deprecated-list-item__graphic mdc-menu__selection-group-icon" tag="div"><i class="material-icons svelte-12qhfyh">check</i><!----><!----><!----></span><!--]--><!----> <!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Unity<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----><!----></li><!----><!--]--><!--]--><!--]--><!----></ul></li><!----> <!--[--><!--[-1--><!----><li class="mdc-deprecated-list-divider" role="separator"><!----><!----></li><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="color: inherit;" role="menuitem" aria-disabled="false" tabindex="-1" href="/THEMING.md"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->Learn about theming<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="color: inherit;" role="menuitem" aria-disabled="false" tabindex="-1" href="https://github.com/hperrin/svelte-material-ui/tree/master/packages/site/src/theme" target="_blank" rel="noreferrer noorigin"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text"><!---->See the theme source<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!----><!----><!----><!----></ul><!----><!--]--><!--]--><!----><!----></div><!----></div><!----></section><!----><!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></header><!---->
204 <div class="drawer-container svelte-12qhfyh"><aside class="mdc-drawer demo-drawer mdc-theme--secondary-bg hide-initial-small"><!--[--><!--[-1--><!----><div class="mdc-drawer__content" style="padding-bottom: 44px;"><!--[--><!--[-1--><!----><nav class="mdc-deprecated-list" role="list"><!--[--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/INSTALL.md"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Installation<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/SVELTEKIT.md"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->SvelteKit<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/THEMING.md"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Theming<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/MIGRATING.md"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Migrating<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[0--><!--[--><!--[1--><!----><hr class="mdc-deprecated-list-divider" role="separator"><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/quick-guide/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Quick Guide<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[0--><!--[--><!--[1--><!----><hr class="mdc-deprecated-list-divider" role="separator"><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/accordion/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Accordion<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item mdc-deprecated-list-item--activated smui-menu-item--non-interactive" style="" aria-current="page" tabindex="-1"><!--[-1--><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Action Buttons<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></span><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/button/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Button<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/fab/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Floating Action Button<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/icon-button/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Icon Button<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item mdc-deprecated-list-item--activated smui-menu-item--non-interactive" style="" aria-current="page" tabindex="-1"><!--[-1--><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->App Bars<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></span><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/bottom-app-bar/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Bottom App Bar<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/top-app-bar/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Top App Bar<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/badge/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Badge<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/banner/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Banner<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/card/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Cards<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/common/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Common<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/data-table/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Data Table<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/dialog/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Dialog<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/drawer/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Drawer<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/elevation/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Elevation<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/flyout-panel/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Flyout Panel<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/image-list/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Image List<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item mdc-deprecated-list-item--activated smui-menu-item--non-interactive" style="" aria-current="page" tabindex="-1"><!--[-1--><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Inputs and Controls<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></span><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/autocomplete/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Autocomplete<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/checkbox/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Checkbox<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/chips/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Chips<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/chip-input/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Chip Input<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/form-field/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Form Field<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/radio/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Radio Button<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/segmented-button/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Segmented Button<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/select/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Select Menu<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;
204" tabindex="-1" href="/demo/slider/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Slider<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/switch/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Switch<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/textfield/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Text Field<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/layout-grid/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Layout Grid<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/list/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->List<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/menu-surface/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Menu Surface<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/menu/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Menu<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/paper/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Paper<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item mdc-deprecated-list-item--activated smui-menu-item--non-interactive" style="" aria-current="page" tabindex="-1"><!--[-1--><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Progress Indicators<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></span><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/circular-progress/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Circular Progress<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="margin-left: 25px;" tabindex="-1" href="/demo/linear-progress/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Linear Progress<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/ripple/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Ripple<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/snackbar/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Snackbar<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/tabs/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Tabs<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/tooltip/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Tooltip<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/touch-target/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Touch Target<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--[-1--><!--[--><!--[-1--><!----><a class="mdc-deprecated-list-item" style="" tabindex="-1" href="/demo/typography/"><!--[0--><span class="mdc-deprecated-list-item__ripple"></span><!--]--><!--[--><!--[-1--><!----><span class="mdc-deprecated-list-item__text mdc-theme--on-secondary"><!---->Typography<!----><!----><!----><!----></span><!----><!--]--><!--]--><!----><!----><!----></a><!----><!--]--><!--]--><!--]--><!--]--><!----><!----><!----></nav><!----><!--]--><!--]--><!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></aside><!----> <!--[-1--><!--]--> <!--[--><!--[-1--><!----><div class="mdc-drawer-app-content demo-app-content"><main class="demo-main-content svelte-12qhfyh"><!--[--><section class="svelte-1uha8ag"><div style="margin: 5em 0 6em;"><h2 style="margin-bottom: 0;">Svelte Material UI</h2> <p class="mdc-typography--subtitle1">Material UI components for Svelte apps</p></div> <div style="margin: 4em 0;"><div class="boxes svelte-1uha8ag"><div class="smui-paper smui-paper--raised smui-paper--elevation-z1 smui-paper--rounded smui-paper--color-primary box"><!--[--><!--[-1--><!----><h5 class="smui-paper__title" style="display: flex; justify-content: space-between; align-items: center;"><span>Svelte</span> <!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 1em; height: auto;" viewBox="0 0 24 24">
204<path fill="currentColor" d="M10.354 21.125a4.44 4.44 0 0 1-4.765-1.767 4.109 4.109 0 0 1-.703-3.107 3.898 3.898 0 0 1 .134-.522l.105-.321.287.21a7.21 7.21 0 0 0 2.186 1.092l.208.063-.02.208a1.253 1.253 0 0 0 .226.83 1.337 1.337 0 0 0 1.435.533 1.231 1.231 0 0 0 .343-.15l5.59-3.562a1.164 1.164 0 0 0 .524-.778 1.242 1.242 0 0 0-.211-.937 1.338 1.338 0 0 0-1.435-.533 1.23 1.23 0 0 0-.343.15l-2.133 1.36a4.078 4.078 0 0 1-1.135.499 4.44 4.44 0 0 1-4.765-1.766 4.108 4.108 0 0 1-.702-3.108 3.855 3.855 0 0 1 1.742-2.582l5.589-3.563a4.072 4.072 0 0 1 1.135-.499 4.44 4.44 0 0 1 4.765 1.767 4.109 4.109 0 0 1 .703 3.107 3.943 3.943 0 0 1-.134.522l-.105.321-.286-.21a7.204 7.204 0 0 0-2.187-1.093l-.208-.063.02-.207a1.255 1.255 0 0 0-.226-.831 1.337 1.337 0 0 0-1.435-.532 1.231 1.231 0 0 0-.343.15L8.62 9.368a1.162 1.162 0 0 0-.524.778 1.24 1.24 0 0 0 .211.937 1.338 1.338 0 0 0 1.435.533 1.235 1.235 0 0 0 .344-.151l2.132-1.36a4.067 4.067 0 0 1 1.135-.498 4.44 4.44 0 0 1 4.765 1.766 4.108 4.108 0 0 1 .702 3.108 3.857 3.857 0 0 1-1.742 2.583l-5.589 3.562a4.072 4.072 0 0 1-1.135.499m10.358-17.95C18.484-.015 14.082-.96 10.9 1.068L5.31 4.63a6.412 6.412 0 0 0-2.896 4.295 6.753 6.753 0 0 0 .666 4.336 6.43 6.43 0 0 0-.96 2.396 6.833 6.833 0 0 0 1.168 5.167c2.229 3.19 6.63 4.135 9.812 2.108l5.59-3.562a6.41 6.41 0 0 0 2.896-4.295 6.756 6.756 0 0 0-.665-4.336 6.429 6.429 0 0 0 .958-2.396 6.831 6.831 0 0 0-1.167-5.168Z"></path><!----><!----></svg><!--]--><!--]--><!----><!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI provides strictly typed Svelte components and actions for a wide
205          variety of interface elements. SMUI also provides helper utilities for
206          building custom and advanced UI components.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----><!----></div><!----> <div class="smui-paper smui-paper--raised smui-paper--elevation-z1 smui-paper--rounded smui-paper--color-svelte-blue box"><!--[--><!--[-1--><!----><h5 class="smui-paper__title" style="display: flex; justify-content: space-between; align-items: center;"><span>Material</span> <!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 1em; height: auto;" viewBox="0 0 24 24"><path fill="currentColor" d="M11.9998 23.9997c-1.6545 0-3.218-.309-4.691-.927-1.4544-.6364-2.7269-1.4909-3.8179-2.5639-1.073-1.0905-1.9274-2.3634-2.5634-3.8179C.3085 15.2179 0 13.6545 0 12c0-1.6725.309-3.2364.927-4.6909.6365-1.4545 1.491-2.718 2.564-3.791C4.5818 2.4278 5.8543 1.5733 7.3087.9548c1.473-.6365 3.0365-.9545 4.691-.9545 1.673 0 3.2364.318 4.6909.955 1.4544.618 2.7179 1.4725 3.7909 2.563 1.091 1.073 1.945 2.3364 2.5634 3.7909C23.6815 8.7641 24 10.3275 24 12c0 1.655-.3185 3.218-.955 4.6909-.618 1.4545-1.4724 2.7274-2.5634 3.818-1.073 1.0729-2.3365 1.9274-3.791 2.5639-1.455.618-3.0179.927-4.6909.927zm-7.6364-5.8633V5.8636A9.4843 9.4843 0 0 0 2.755 8.7001C2.373 9.7365 2.1825 10.8365 2.1825 12s.1905 2.2725.5724 3.3274a9.5713 9.5713 0 0 0 1.609 2.809zm1.5-13.7727H18.163a9.4848 9.4848 0 0 0-2.836-1.609c-1.0549-.382-2.1639-.5725-3.3273-.5725-1.1635 0-2.2725.1905-3.327.5725a9.5713 9.5713 0 0 0-2.8094 1.609Zm6.1364 10.3637 4.1179-8.1818H7.9088Zm1.091 2.727h4.3633V8.7276Zm-6.5454 0h4.3634L6.5454 8.7276Zm8.7813 3.791c1.0545-.382 2-.918 2.836-1.609H5.8628a9.5713 9.5713 0 0 0 2.8094 1.609c1.0545.3819 2.1635.5724 3.327.5724 1.0543 0 2.1823-.1579 3.3274-.5725zm4.3089-3.109a9.5713 9.5713 0 0 0 1.609-2.809c.382-1.055.5724-2.164.5724-3.3274 0-1.1635-.1905-2.2635-.5724-3.3-.382-1.055-.918-1.9999-1.609-2.8364Z"></path><!----><!----></svg><!--]--><!--]--><!----><!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI components follow the <a style="color: #fff;" href="https://m2.material.io/" target="_blank">Material Spec</a>, by Google. As well as implementing the components from the spec as
207          closely as possible, SMUI provides additional components that aim to
208          match the Material design while giving you flexibility and ease of
209          development.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----><!----></div><!----> <div class="smui-paper smui-paper--raised smui-paper--elevation-z1 smui-paper--rounded smui-paper--color-secondary box"><!--[--><!--[-1--><!----><h5 class="smui-paper__title" style="display: flex; justify-content: space-between; align-items: center;"><span>Sass</span> <!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 1em; height: auto;" viewBox="0 0 24 24">
209<path fill="currentColor" d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zM9.615 15.998c.175.645.156 1.248-.024 1.792l-.065.18c-.024.061-.052.12-.078.176-.14.29-.326.56-.555.81-.698.759-1.672 1.047-2.09.805-.45-.262-.226-1.335.584-2.19.871-.918 2.12-1.509 2.12-1.509v-.003l.108-.061zm9.911-10.861c-.542-2.133-4.077-2.834-7.422-1.645-1.989.707-4.144 1.818-5.693 3.267C4.568 8.48 4.275 9.98 4.396 10.607c.427 2.211 3.457 3.657 4.703 4.73v.006c-.367.18-3.056 1.529-3.686 2.925-.675 1.47.105 2.521.615 2.655 1.575.436 3.195-.36 4.065-1.649.84-1.261.766-2.881.404-3.676.496-.135 1.08-.195 1.83-.104 2.101.24 2.521 1.56 2.43 2.1-.09.539-.523.854-.674.944-.15.091-.195.12-.181.181.015.09.091.09.21.075.165-.03 1.096-.45 1.141-1.471.045-1.29-1.186-2.729-3.375-2.7-.9.016-1.471.091-1.875.256-.03-.045-.061-.075-.105-.105-1.35-1.455-3.855-2.475-3.75-4.41.03-.705.285-2.564 4.8-4.814 3.705-1.846 6.661-1.335 7.171-.21.733 1.604-1.576 4.59-5.431 5.024-1.47.165-2.235-.404-2.431-.615-.209-.225-.239-.24-.314-.194-.12.06-.045.255 0 .375.12.3.585.825 1.396 1.095.704.225 2.43.359 4.5-.45 2.324-.899 4.139-3.405 3.614-5.505l.073.067z"></path><!----><!----></svg><!--]--><!--]--><!----><!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI is styled with Sass. SMUI provides variables to customize the
210          look of the UI and mixins to help style your own elements. You can
211          customize the look of your UI with <a style="color: #fff;" href="https://github.com/hperrin/svelte-material-ui/blob/master/packages/site/src/theme/_smui-theme.scss" target="_blank">just a few variables</a>.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----><!----></div><!----></div> <div style="margin: 0.5em 0 6.5em; text-align: center;"><div><!--[--><!--[-1--><!----><a class="mdc-icon-button mdc-icon-button--display-flex" style="color: var(--mdc-on-surface);" href="https://matrix.to/#/#smui:matrix.port87.help" title="Join the Matrix Space"><div class="mdc-icon-button__ripple"></div> <!--[0--><span class="mdc-icon-button__focus-ring"></span><!--]--> <!--[--><!--[0--><svg class="mdc-icon-button__icon" aria-hidden="true" focusable="false" tabindex="-1" viewBox="0 0 24 24"><path fill="currentColor" d="M.632.55v22.9H2.28V24H0V0h2.28v.55zm7.043 7.26v1.157h.033c.309-.443.683-.784 1.117-1.024.433-.245.936-.365 1.5-.365.54 0 1.033.107 1.481.314.448.208.785.582 1.02 1.108.254-.374.6-.706 1.034-.992.434-.287.95-.43 1.546-.43.453 0 .872.056 1.26.167.388.11.716.286.993.53.276.245.489.559.646.951.152.392.23.863.23 1.417v5.728h-2.349V11.52c0-.286-.01-.559-.032-.812a1.755 1.755 0 0 0-.18-.66 1.106 1.106 0 0 0-.438-.448c-.194-.11-.457-.166-.785-.166-.332 0-.6.064-.803.189a1.38 1.38 0 0 0-.48.499 1.946 1.946 0 0 0-.231.696 5.56 5.56 0 0 0-.06.785v4.768h-2.35v-4.8c0-.254-.004-.503-.018-.752a2.074 2.074 0 0 0-.143-.688 1.052 1.052 0 0 0-.415-.503c-.194-.125-.476-.19-.854-.19-.111 0-.259.024-.439.074-.18.051-.36.143-.53.282-.171.138-.319.337-.439.595-.12.259-.18.6-.18 1.02v4.966H5.46V7.81zm15.693 15.64V.55H21.72V0H24v24h-2.28v-.55z"></path><!----><!----></svg><!--]--><!--]--><!----><!--[-1--><!--]--><!----><!----></a><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><a class="mdc-icon-button mdc-icon-button--display-flex" style="color: var(--mdc-on-surface);" href="https://discord.gg/aFzmkrmg9P" title="Join the Discord Server"><div class="mdc-icon-button__ripple"></div> <!--[0--><span class="mdc-icon-button__focus-ring"></span><!--]--> <!--[--><!--[0--><svg class="mdc-icon-button__icon" aria-hidden="true" focusable="false" tabindex="-1" viewBox="0 0 24 24"><path fill="currentColor" d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"></path><!----><!----></svg><!--]--><!--]--><!----><!--[-1--><!--]--><!----><!----></a><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><a class="mdc-icon-button mdc-icon-button--display-flex" style="color: var(--mdc-on-surface);" href="https://port87.social/@hperrin" title="Hunter Perrin (SMUI Author) on Mastodon"><div class="mdc-icon-button__ripple"></div> <!--[0--><span class="mdc-icon-button__focus-ring"></span><!--]--> <!--[--><!--[0--><svg class="mdc-icon-button__icon" aria-hidden="true" focusable="false" tabindex="-1" viewB
211ox="0 0 24 24"><path fill="currentColor" d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"></path><!----><!----></svg><!--]--><!--]--><!----><!--[-1--><!--]--><!----><!----></a><!----><!--]--><!--]--><!----></div> <h4 class="mdc-typography--headline6">Made with ❤️ by <a style="color: var(--mdc-on-surface);" href="https://port87.com/" target="_blank">Port87 Email</a></h4></div> <div class="features-list svelte-1uha8ag"><div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-primary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24"><path fill="currentColor" d="M3,3H21V21H3V3M13.71,17.86C14.21,18.84 15.22,19.59 16.8,19.59C18.4,19.59 19.6,18.76 19.6,17.23C19.6,15.82 18.79,15.19 17.35,14.57L16.93,14.39C16.2,14.08 15.89,13.87 15.89,13.37C15.89,12.96 16.2,12.64 16.7,12.64C17.18,12.64 17.5,12.85 17.79,13.37L19.1,12.5C18.55,11.54 17.77,11.17 16.7,11.17C15.19,11.17 14.22,12.13 14.22,13.4C14.22,14.78 15.03,15.43 16.25,15.95L16.67,16.13C17.45,16.47 17.91,16.68 17.91,17.26C17.91,17.74 17.46,18.09 16.76,18.09C15.93,18.09 15.45,17.66 15.09,17.06L13.71,17.86M13,11.25H8V12.75H9.5V20H11.25V12.75H13V11.25Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Fully, Strictly Typed<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI is strictly typed with TypeScript. This not only helps catch
212            bugs early, it helps while developing as every property is
213            autocompleted by modern IDEs.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-secondary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24"><path fill="currentColor" d="M21,9H15V22H13V16H11V22H9V9H3V7H21M12,2A2,2 0 0,1 14,4A2,2 0 0,1 12,6C10.89,6 10,5.1 10,4C10,2.89 10.89,2 12,2Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Accessible by Default<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI automatically adds appropriate ARIA attributes to components to
214            provide accessibility to screen readers. SMUI is also fully keyboard
215            accessible, meaning motor impaired users can easily use SMUI
216            components.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-primary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24">
216<path fill="currentColor" d="M10,9A1,1 0 0,1 11,8A1,1 0 0,1 12,9V13.47L13.21,13.6L18.15,15.79C18.68,16.03 19,16.56 19,17.14V21.5C18.97,22.32 18.32,22.97 17.5,23H11C10.62,23 10.26,22.85 10,22.57L5.1,18.37L5.84,17.6C6.03,17.39 6.3,17.28 6.58,17.28H6.8L10,19V9M11,5A4,4 0 0,1 15,9C15,10.5 14.2,11.77 13,12.46V11.24C13.61,10.69 14,9.89 14,9A3,3 0 0,0 11,6A3,3 0 0,0 8,9C8,9.89 8.39,10.69 9,11.24V12.46C7.8,11.77 7,10.5 7,9A4,4 0 0,1 11,5Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Touch Friendly<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI provides increased touch targets to allow ease of use on mobile
217            devices, conforming to the Material Spec requirement of minimum 48px
218            x 48px touch targets.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-secondary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24"><path fill="currentColor" d="M9,6H5V10H7V8H9M19,10H17V12H15V14H19M21,16H3V4H21M21,2H3C1.89,2 1,2.89 1,4V16A2,2 0 0,0 3,18H10V20H8V22H16V20H14V18H21A2,2 0 0,0 23,16V4C23,2.89 22.1,2 21,2"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Server Side Rendering<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI can be fully rendered on the server, meaning faster time to
219            first meaningful paint. SMUI fully supports SvelteKit. In fact, the
220            site you're looking at is a SvelteKit app.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-primary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24"><path fill="currentColor" d="M17.5,12A1.5,1.5 0 0,1 16,10.5A1.5,1.5 0 0,1 17.5,9A1.5,1.5 0 0,1 19,10.5A1.5,1.5 0 0,1 17.5,12M14.5,8A1.5,1.5 0 0,1 13,6.5A1.5,1.5 0 0,1 14.5,5A1.5,1.5 0 0,1 16,6.5A1.5,1.5 0 0,1 14.5,8M9.5,8A1.5,1.5 0 0,1 8,6.5A1.5,1.5 0 0,1 9.5,5A1.5,1.5 0 0,1 11,6.5A1.5,1.5 0 0,1 9.5,8M6.5,12A1.5,1.5 0 0,1 5,10.5A1.5,1.5 0 0,1 6.5,9A1.5,1.5 0 0,1 8,10.5A1.5,1.5 0 0,1 6.5,12M12,3A9,9 0 0,0 3,12A9,9 0 0,0 12,21A1.5,1.5 0 0,0 13.5,19.5C13.5,19.11 13.35,18.76 13.11,18.5C12.88,18.23 12.73,17.88 12.73,17.5A1.5,1.5 0 0,1 14.23,16H16A5,5 0 0,0 21,11C21,6.58 16.97,3 12,3Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Fully Themable<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->Components are themable using Sass variables. Everything from their
221            shape, color, density, borders, interaction states, and more is
222            themable.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-secondary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24"><path fill="currentColor" d="M20 2H4C2.9 2 2 2.9 2 4V16C2 17.1 2.9 18 4 18H8V21C8 21.6 8.4 22 9 22H9.5C9.7 22 10 21.9 10.2 21.7L13.9 18H20C21.1 18 22 17.1 22 16V4C22 2.9 21.1 2 20 2M16 11H11.5L13.3 12.8L12 14L8 10L12 6L13.2 7.2L11.5 9H16V11Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->RTL/Internationalization Support<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI is RTL aware, and components will adapt their design to suit
223            the language of the user.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-primary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24">
223<path fill="currentColor" d="M12,5.5A3.5,3.5 0 0,1 15.5,9A3.5,3.5 0 0,1 12,12.5A3.5,3.5 0 0,1 8.5,9A3.5,3.5 0 0,1 12,5.5M5,8C5.56,8 6.08,8.15 6.53,8.42C6.38,9.85 6.8,11.27 7.66,12.38C7.16,13.34 6.16,14 5,14A3,3 0 0,1 2,11A3,3 0 0,1 5,8M19,8A3,3 0 0,1 22,11A3,3 0 0,1 19,14C17.84,14 16.84,13.34 16.34,12.38C17.2,11.27 17.62,9.85 17.47,8.42C17.92,8.15 18.44,8 19,8M5.5,18.25C5.5,16.18 8.41,14.5 12,14.5C15.59,14.5 18.5,16.18 18.5,18.25V20H5.5V18.25M0,20V18.5C0,17.11 1.89,15.94 4.45,15.6C3.86,16.28 3.5,17.22 3.5,18.25V20H0M24,20H20.5V18.25C20.5,17.22 20.14,16.28 19.55,15.6C22.11,15.94 24,17.11 24,18.5V20Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Widely Used, a Growing Community<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->With over <a href="https://github.com/hperrin/svelte-material-ui/network/dependents?package_id=UGFja2FnZS01NTM5MDg5MDQ" target="_blank">3,000 projects</a> using SMUI components, it is the most popular Svelte UI library. For
224            good reason, too. It is the most versatile and adaptable Svelte UI library,
225            guaranteed.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-secondary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24"><path fill="currentColor" d="M10,4V1L14,5L10,9V6A6,6 0 0,0 4,12L4.08,13H2.06L2,12A8,8 0 0,1 10,4M17,2H20A2,2 0 0,1 22,4V20A2,2 0 0,1 20,22H17A2,2 0 0,1 15,20V4A2,2 0 0,1 17,2M4,15H13V22H4A2,2 0 0,1 2,20V17A2,2 0 0,1 4,15Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Adaptable, Versatile<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->SMUI supports adding arbitrary attributes and actions to every
226            component and many internal elements within them. SMUI forwards all
227            events from every component, and supports event modifiers, including
228            passive. SMUI works in the Svelte REPL, meaning you can <a href="https://svelte.dev/repl/aa857c3bb5eb478cbe6b1fd6c6da522a" target="_blank">play with it right now</a>.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----> <div class="smui-paper smui-paper--outlined smui-paper--rounded smui-paper--color-primary"><div style="width: 40px;"><!--[--><!--[0--><svg class="" aria-hidden="true" focusable="false" tabindex="-1" style="width: 40px; height: 40px;" viewBox="0 0 24 24"><path fill="currentColor" d="M10,17L6,13L7.41,11.59L10,14.17L16.59,7.58L18,9M12,3A1,1 0 0,1 13,4A1,1 0 0,1 12,5A1,1 0 0,1 11,4A1,1 0 0,1 12,3M19,3H14.82C14.4,1.84 13.3,1 12,1C10.7,1 9.6,1.84 9.18,3H5A2,2 0 0,0 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5A2,2 0 0,0 19,3Z"></path><!----><!----></svg><!--]--><!--]--><!----></div> <div style="flex-grow: 1;"><!--[--><!--[-1--><!----><h5 class="smui-paper__title"><!---->Material Design Compliant<!----><!----><!----><!----></h5><!----><!--]--><!--]--><!----> <!--[--><!--[-1--><!----><div class="smui-paper__content"><!---->Every SMUI component fully follows the Material Design
229            specification. You can build up-to-spec UIs with SMUI.<!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!----></div><!----></div></div> <div style="margin: 4em 0;"><p>[ <a href="https://matrix.to/#/#smui:matrix.port87.help">Matrix</a> | <a href="https://discord.gg/aFzmkrmg9P">Discord</a> | <a href="https://github.com/hperrin/svelte-material-ui">GitHub</a> | <a href="https://github.com/hperrin/svelte-material-ui/issues">Issue Tracker</a> | © 2019-2026 Hunter Perrin ]</p></div></section><!--]--><!----></main><!----><!----><!----><!----></div><!----><!--]--><!--]--><!----></div><!--]--><!--]--><!--]--> <!--[-1--><!--]--><!--]-->
230			
231			
231<script>
232				{
233					__sveltekit_c5rzhx = {
234						base: new URL(".", location).pathname.slice(0, -1)
235					};
236
237					const element = document.currentScript.parentElement;
238
239					Promise.all([
240						import("./_app/immutable/entry/start.CrBwZ__W.js"),
241						import("./_app/immutable/entry/app.C9dKaIEz.js")
242					]).then(([kit, app]) => {
243						kit.start(app, element, {
244							node_ids: [0, 2],
245							data: [null,null],
246							form: null,
247							error: null
248						});
249					});
250				}
251			</script>
251
252		</div>
253  
253<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"a4b1faf6310540f08b65d3d15a2ffe02","r":1,"spa":2}' crossorigin="anonymous"></script>
253
254</body>
255</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.