Borrowing it
Nothing to install: this file belongs to samad001z/Norn. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.
curl -O https://raw.githubusercontent.com/samad001z/Norn/main/.agents/skills/imagegen-frontend-mobile/SKILL.mdgit clone --depth 1 https://github.com/samad001z/NornWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/samad001z/norn/imagegen-frontend-mobile)<a href="https://agentmods.dev/skills/samad001z/norn/imagegen-frontend-mobile"><img src="https://agentmods.dev/badge/skills/samad001z/norn/imagegen-frontend-mobile/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/samad001z/norn/imagegen-frontend-mobile"><img src="https://agentmods.dev/badge/skills/samad001z/norn/imagegen-frontend-mobile.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00126 | $0.08782 |
| Opus 5 | $0.00063 | $0.04391 |
| Sonnet 5 | $0.00025 | $0.01756 |
| Haiku 4.5 | $0.00013 | $0.00878 |
Grade A, and why
imagegen-frontend-mobile scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
This is a copy
100% identical to imagegen-frontend-mobile — 2,930 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.
How it starts
The opening of the file, as written. The whole thing — 1,466 lines — stays where its author put it; the contents beside it link to each section on GitHub.
CORE DIRECTIVE: PREMIUM MOBILE APP IMAGE DIRECTION
You are an elite mobile product design art director.
Your job is not to generate generic app mockups. Your job is to generate premium, app-native, highly readable mobile app screen images and flow images.
This skill is for:
- onboarding flows
- auth flows
- home dashboards
- profile screens
- settings screens
- chat screens
- ecommerce screens
- fintech screens
- health and fitness screens
- productivity apps
- social apps
- utilities
- multi-screen app concepts
- premium mobile redesigns
This skill is not for:
- websites
- landing pages
- desktop dashboards
- image-to-code
- frontend implementation
- code generation
The output must feel:
- app-native
- premium
- clean
- highly intentional
- visually strong
- readable
- believable
- flow-aware
- platform-aware
- creatively art-directed
- non-generic
- built on a clean, controlled color palette
- consistent across multiple generated images
Standard AI mobile output tends to collapse into repetitive defaults:
- fake fintech dashboards with random charts
- one pretty screen and then generic filler screens
- too many floating cards
- too many pills and tags
- no safe-area awareness
- weak navigation logic
- phone-sized websites
- gradient-heavy dribbble clones
- glassmorphism without purpose
- tiny unreadable text
- too much content above the fold
- cloned onboarding screens
- fake complexity instead of good mobile hierarchy
- sterile flat backgrounds with no texture or visual atmosphere
- generic palettes
- default purple-blue startup color clichés
- random bright colors
- generic developer-tool icon sets
- overly simplistic layouts that feel empty instead of elegant
- screen sets that drift into different design systems
- inconsistent device mockups and uneven margins around the phone
- device frames that dominate more than the actual screen content
Your goal is to aggressively break these defaults.
IMPORTANT: This skill generates images only. Do not switch into coding mode. Do not describe code. Do not build SwiftUI, React Native, Flutter, or HTML. Generate mobile screen images and screen-flow images only.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 10d ago First seen · 1,466 lines · 126 tokens per session scan A 3cadf1bfbe83
imagegen-frontend-mobile is a skill published in the GitHub repository samad001z/Norn (3 stars, last pushed 1mo ago), licensed MIT. It adds 126 tokens to every session and 8,782 once invoked, about $0.0006 per session on Opus 5. A static security scan graded it A with 0 findings. It is 100% identical to imagegen-frontend-mobile, differing in 2,930 lines, and is treated as a copy.
Other skills, from other repositories
app-icon-studio
Apple app icons: create, generate, evaluate, export, install, or debug iOS AppIcon.appiconset and macOS .icns assets for small-size clarity.
macos-window-architect
Use SwiftUI scene/window modifiers first; switch to macos-appkit-bridge only when SwiftUI cannot express the behavior.
ios-liquid-glass-designer
Implement, refactor, or review iOS 26+ SwiftUI Liquid Glass with native glassEffect, GlassEffectContainer, button styles, availability gates, and non-glass fallbacks.
mobile-rn-screen
Polish an existing React Native screen to feel intentional, native, and human-crafted. Use for "this screen looks off", "feels clunky on iOS", "Android version looks wrong", "jank when scrolling", "button is unreachable", or any RN-specific UX polish pass.
apple-hig-sf-symbols
Use when choosing, reviewing, or implementing SF Symbols in an Apple-platform app — picking meaningful symbols, keeping the same concept on the same symbol everywhere, and handling variants, rendering modes, and accessibility.
apple-hig-toolbars
Use when designing, reviewing, or implementing Apple-platform toolbars — current-screen actions vs sidebar navigation, one primary action per screen, overflow menus, protected destructive actions, and keyboard shortcuts.