# DESIGN.md with Gemini CLI

> Import DESIGN.md into GEMINI.md with @./DESIGN.md so Gemini CLI follows your design tokens. Check what loaded with /memory show. Sample file included.

Canonical page: https://sitepeel.dev/guides/design-md-gemini-cli/

Save DESIGN.md in your project and add @./DESIGN.md to GEMINI.md. Gemini CLI then sends your design tokens and rules with every prompt.

Published: 2026-10-24

Tool used in this guide: [Design MD generator](https://sitepeel.dev/design-md-generator/index.md)

## How to use it

1. **Add DESIGN.md to the project** Generate it from a site with Sitepeel, review it and save it next to GEMINI.md.
2. **Import it in GEMINI.md** Add a line with @./DESIGN.md, outside any code block, plus a few must-follow rules.
3. **Reload and check** Run /memory reload, then /memory show to confirm the DESIGN.md tokens appear in the context.
4. **Ask for one screen** Name the page, its content and its main action. Ask Gemini to list the tokens it used.
5. **Review the result** Compare the page with DESIGN.md at phone and desktop widths. Add a Do or Don’t when mistakes repeat.

## Sample GEMINI.md with a DESIGN.md import

Gemini CLI reads GEMINI.md from your home folder, your workspace and its parent folders, joins them and sends them with each prompt. The @ line pulls DESIGN.md into that context.

Example: GEMINI.md

```
# Project context

## UI design
@./DESIGN.md

- Use the tokens above for every color, font, spacing and radius.
- Reuse existing components before creating new ones.
- If DESIGN.md has no rule for a case, ask before inventing one.
```

## How GEMINI.md files and imports load

- Global: ~/.gemini/GEMINI.md applies to all your projects
- Project: GEMINI.md files in your workspace folders and their parent folders
- Just in time: when a tool opens a folder, GEMINI.md files there load too
- Imports take relative (@./, @../) or absolute paths
- Nested imports stop at five levels by default; circular imports are blocked
- The footer shows how many context files are loaded

## Check and reload the context

Gemini CLI memory commands

| Command | What it does |
| --- | --- |
| /memory show | Prints the full, combined context sent to the model |
| /memory list | Lists the GEMINI.md files in use |
| /memory reload | Re-reads all GEMINI.md files after you edit them (also /memory refresh) |
| @DESIGN.md in a prompt | Adds the file’s contents to that one prompt |

- [Gemini still ignores the design? Check these five things](https://sitepeel.dev/guides/ai-ignoring-design-md/index.md)

## Use AGENTS.md instead of GEMINI.md

GEMINI.md is only the default name. If your repository already has AGENTS.md for Codex or Cursor, set context.fileName in settings.json to a list that includes AGENTS.md and GEMINI.md. Gemini CLI then loads both.

- [Sample AGENTS.md section for DESIGN.md](https://sitepeel.dev/guides/design-md-codex/index.md)

## Questions and answers

### Can GEMINI.md import other files?

Yes. Write @ followed by a path, such as @./DESIGN.md or @../shared/style.md. Relative and absolute paths work, imported files can import others, and nesting stops at five levels by default.

### How do I see what context Gemini CLI loaded?

Run /memory show to print the combined context sent to the model, or /memory list to see which GEMINI.md files are in use.

### Can Gemini CLI read AGENTS.md?

Yes, if you add it to context.fileName in settings.json, for example as a list with AGENTS.md and GEMINI.md. By default it looks for GEMINI.md.

### Do I need to restart Gemini CLI after editing DESIGN.md?

No. Run /memory reload (or /memory refresh) to re-read your GEMINI.md files, then /memory show to check the result.

## Further reading

- [Gemini CLI docs: Provide context with GEMINI.md files](https://geminicli.com/docs/cli/gemini-md)
- [Gemini CLI docs: Memory import processor](https://geminicli.com/docs/reference/memport)
- [Gemini CLI docs: Commands](https://geminicli.com/docs/reference/commands)

## Related pages

- [What is DESIGN.md](https://sitepeel.dev/guides/what-is-design-md/index.md): DESIGN.md is a Markdown design-system file for AI coding agents. See its format, a small example, the official linter and how to make one from any site.
- [DESIGN.md with Claude Code](https://sitepeel.dev/guides/design-md-claude-code/index.md): Import DESIGN.md into CLAUDE.md with @DESIGN.md so Claude Code follows your colors, type and spacing. Includes a sample CLAUDE.md and checks.
- [DESIGN.md with Codex](https://sitepeel.dev/guides/design-md-codex/index.md): Make OpenAI Codex follow DESIGN.md with a few lines in AGENTS.md. See where Codex looks for instructions, its size limit and how to check what loaded.
- [Use Design MD with AI](https://sitepeel.dev/guides/use-design-md-with-ai/index.md): Hand DESIGN.md to Cursor, Claude Code or another AI coding assistant: where to save it, two prompts to copy and how to review what it builds.
- [When AI ignores DESIGN.md](https://sitepeel.dev/guides/ai-ignoring-design-md/index.md): Your agent has DESIGN.md but the UI is still wrong? Check that it loads, remove conflicting rules, name real components and verify the result.