Come join the new Etcher Discord Server!

Etcher ⚒️

Create reusable web components without touching a single line of javascript.
▲ ~ npm create etcher@latest
Need to install the following packages: create-etcher Ok to proceed? (y)
Over 5100 downloads.


With Etcher, you can make your development process easier and faster. Etcher lets you speed up your workflow without needing to set up tons of boilerplate code.

Let's Go →
<!-- src/components/Header.xtml -->

<h1>🎉 Hello {{name}}.. 🎉</h1>

    h1 {
        color: #666ee0;
        font-size: 3rem;

<!-- src/pages/index.xtml -->

<etcher-Header name="World"></etcher-Header>
▲ ~/my-etcher-app etcher
. oooo .o8 `888 .ooooo. .o888oo .ooooo. 888 .oo. .ooooo. oooo d8b d88' `88b 888 d88' `"Y8 888P"Y88b d88' `88b `888""8P 888ooo888 888 888 888 888 888ooo888 888 888 .o 888 . 888 .o8 888 888 888 .o 888 `Y8bod8P' "888" `Y8bod8P' o888o o888o `Y8bod8P' d888b ---------------------------------------------------------- Generating chunks... Transforming Description.xtml... Transformed Description.xtml! Transforming Header.xtml... Transformed Header.xtml! Finished Generating chunks! Migrating pages... Migrating index.xtml... Migrated index.xtml! Finished Migrating pages!


Our documentation will go through all of Etcher's features and quirks. We'll walk you through how to use Etcher to create a basic site that takes advantage of Etcher.

Get Started →

Let's talk about size...

Etcher is small and perfect for simple sites that don't need a traditional framework.

Etcher 2.3.0 - 567KB
Solid 1.6.9 - 791KB
Vue 3.2.45 - 2.5MB
React 18.2.0 - 4.8MB
Svelte 3.55.1 - 9.7MB
*All packages represented by 'Unpacked Size' from npm registry.