# Dosmos

> Dosmos is a free, open-source desktop app for frontend development. It puts a
> browser, a code editor, a terminal, and Chrome DevTools in one window. You
> click an element on your running site and your AI coding agent receives the
> exact source file and line number to change — no screenshots, no describing
> which button you mean.

## Facts

- Name: Dosmos (formerly "Design in the Browser")
- Website: https://dosmos.app
- Source: https://github.com/assentorp/dosmos (open source)
- Price: free. No account, no subscription, no paid tier.
- Platforms: macOS 13+ (Apple Silicon and Intel), Windows 10+
- Requires: a command-line AI coding agent — Claude Code, Cursor, Codex, Antigravity, or Qwen
- Privacy: code and projects stay on your device; product analytics are opt-in

## What it does

- Point & Click — click any element to send it to the AI with its source file and line
- Area Select — drag a box around a region to give the AI visual context
- Multi-Edit — select several elements, queue changes, send them at once
- Reference Images — drop screenshots in as real images for the AI to match
- Built-in code editor — click an element and its source opens on the exact line
- Smart source matching — cross-checks component names, attributes, text, and URL
- Integrated terminal — a tab per project, in the same window
- Chrome Web Inspector — full DevTools docked inside the app
- Design tokens — search Tailwind tokens so the AI writes the token, not a hex
- CSS inspector — inspect classes, computed styles, and colours; click to copy
- Grids & guides — spatial and baseline grids, crosshair guides, freeze animations
- Responsive testing — switch desktop, tablet, and mobile viewports

## Pages

- [Home](https://dosmos.app/): what Dosmos is, feature overview, download
- [Setup guide](https://dosmos.app/setup): from a brand-new Mac or PC to a running project
- [About](https://dosmos.app/about): the project and the person behind it
- [Privacy](https://dosmos.app/privacy): what stays on your device

## FAQ

### What is Dosmos?

Dosmos is a free, open-source desktop app that puts a browser, a code editor, a terminal, and Chrome DevTools in one window. You click an element on your running site and your AI coding agent receives the exact source file and line number to change, so you never have to describe or screenshot the element you mean.

### Which AI coding agents does Dosmos work with?

Dosmos runs on top of the command-line coding agent you already use: Claude Code, Cursor, Codex, Antigravity, or Qwen. It does not ship its own model and does not require a separate AI subscription of its own.

### How much does Dosmos cost?

Dosmos is free and open source. There is no account, no subscription, and no paid tier — you download it and start building. You continue to pay only for whichever AI coding agent you already use.

### Which operating systems does Dosmos support?

Dosmos runs on macOS 13 or newer, with separate builds for Apple Silicon and Intel Macs, and on Windows 10 or newer.

### How is Dosmos different from browser DevTools?

Browser DevTools edits styles in the page only, so the change disappears on refresh. Dosmos maps the element you clicked back to its source file and line, so your AI agent edits the real code in your project and the change persists.

### Do I need to know how to code to use Dosmos?

No. The Dosmos setup guide walks you from a brand-new Mac or Windows PC to a running project in plain English, covering how to install Node.js, install a coding agent, and open your first project.

### Does Dosmos send my code anywhere?

No. Your code, your projects, and your API keys stay on your device. Product analytics are opt-in, auto-updates only check for new releases, and Dosmos has no accounts and no payments.