A simpler place to build for the web

Write HTML and CSS. See your website come to life.

Agate is a focused browser-based workspace for building with the web’s foundations—no frameworks, package managers, or unnecessary setup.

Open Agate IDE Explore resources

HTML
CSS
Live preview
Device-local drafts

untitled project

HTML index.html

<main class="idea">
  <p>Built with the web</p>
  <h1>A small idea can become a website.</h1>
  <p>Start with a small idea and shape it directly in HTML and CSS.</p>
  <a href="#">Start somewhere small</a>
</main>

CSS styles.css

body {
  background: #d94f9d;
  color: #2b151d;
  font-family: system-ui;
}

.idea {
  max-width: 17rem;
  padding: 2rem;
  border: 4px solid #2b151d;
  background: #f7efe6;
}

.idea a {
  display: inline-block;
  padding: .6rem .9rem;
  border: 2px solid #2b151d;
  background: #b0436a;
  color: #f7efe6;
}

Built with the web

A small idea can become a website.

Start with a small idea and shape it directly in HTML and CSS.

Start somewhere small

A static illustration of the workflow. Open the IDE to edit both languages and see the preview respond.

Why Agate

The web, without the extra layers.

Agate keeps the languages, the result, and the useful tools close together so you can stay with the thing you are making.

Write directly

Use the HTML and CSS your browser already understands.

See it immediately

Edit beside a live preview and see each idea take shape.

Keep it portable

Copy the source or download one straightforward HTML file.

Resource library

Start from something useful.

Explore sixteen practical HTML and CSS patterns designed to be inspected, copied, changed, and opened directly in the IDE.

Explore HTML and CSS resources

Shape a palette, then take the CSS with you.

Choose, name, and arrange colors with native browser controls, then export the finished palette as CSS custom properties.

Available now · saved on this device Build a color palette

Make something honest

Start with the foundations.

Open the live workspace and begin with direct HTML and CSS.

Open Agate IDE