1. 1

   Install M3 Svelte with npm i m3-svelte (or your package manager).

2. 2

   StyleFromScheme

   Manual

   Copy a theme snippet and paste it on your site.

   +layout.svelte or similar

   <script>
     import { StyleFromScheme } from "m3-svelte";
   </script>
   
   [your theme snippet]

3. 3

   Roboto

   Manual

   Get a font for M3 Svelte to use.

   app.html

   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" />

Now you can start using components like this. Check the rest of the docs to learn more.

<script>
  import { Button } from "m3-svelte";
</script>

<Button type="filled" on:click={() => alert("Hello world!")}>Click me</Button>