Mockup

Hızlı görsel prototip oluşturma için satır içi CSS ile kullanıcı arayüzü maketlerini HTML dosyaları olarak oluşturun.

yazan kuscubasiece·8 Eylül 2026

Kaynak: rohitg00/awesome-claude-code-toolkit · Apache-2.0

Kurulum

mkdir -p .claude/commands && curl -sL https://www.antrophiclove.com/api/kaynak/mockup/raw -o .claude/commands/mockup.md

Hedef dosya: .claude/commands/mockup.md

Önizleme Ham metin ⑂ Kendi sürümünü oluştur

Generate UI mockups as HTML files with inline CSS for rapid visual prototyping.

## Steps


1. Gather the mockup requirements:
2. Create a single HTML file per screen with inline styles:
3. Add realistic placeholder content:
4. Make interactive elements functional with minimal JS:
5. Add annotations explaining design decisions.
6. Test that the mockup renders correctly in a browser.

## Format


```
Mockup: <screen name>
File: <path to HTML file>
Screens: <list of views created>
Interactions: <what is clickable/interactive>
```


## Rules

- Single HTML file per screen with zero external dependencies.
- Use CSS custom properties for colors so they are easy to change.
- Include mobile and desktop layouts using media queries.