design-tutorial

An interactive tutorial for Naksha that teaches its commands through practical exercises. The available lessons cover areas such as user interfaces, Figma, email, data visualizations, artificial-intelligence visuals, print layouts, chatbots, and spatial design.

In plain words
What is it for?
It is for getting started with Naksha, building sample designs, extracting design tokens, preparing developer handoffs, creating dashboards, making email templates, and exploring its other listed workflows.
Why use it?
It gives new users a guided way to learn the tool and see real output instead of reading command descriptions alone. Different tracks let them focus on the type of work they need to do.

Command

Part of the naksha-studio plugin — 47 commands, 7 agents shipped together

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add commands/adityaraj0421/naksha-studio/design-tutorial
Clone the repo
git clone --depth 1 https://github.com/Adityaraj0421/naksha-studio

Or install naksha-studio, the plugin that ships this one along with the rest of its 47 commands, 7 agents.

Per session 28 Only the description is in the session, so the agent can decide to use it. The body loads when it is invoked.
When invoked 6,143 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

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.

ModelPer sessionOnce invoked
Fable 5 $0.00028 $0.06143
Opus 5 $0.00014 $0.03071
Sonnet 5 $0.00006 $0.01229
Haiku 4.5 $0.00003 $0.00614

Measured 3d ago against content hash 52a7b6c4ef28, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

design-tutorial 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 3d 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.

commands/design-tutorial.md · 708 lines

How it starts

The opening of the file, as written. The whole thing — 708 lines — stays where its author put it; the contents beside it link to each section on GitHub.

/design-tutorial

Interactive guided tour of Naksha. Choose a track below and complete a real exercise — you'll produce actual output by the end.

Usage: /design-tutorial or /design-tutorial <track>

Tracks:

  • /design-tutorial quick-start — 5-minute overview: run 3 commands, see what each produces
  • /design-tutorial ui — Build a UI component from scratch → token extraction → developer handoff
  • /design-tutorial figma — Create a component in Figma, add responsive variants, generate prototype
  • /design-tutorial social — Design a post, plan a campaign, build a performance dashboard
  • /design-tutorial email — Build a welcome email template and a 3-email onboarding sequence
  • /design-tutorial data-viz — Design a bar chart, then build a full analytics dashboard
  • /design-tutorial ai-visual-gen — Generate image prompts, video briefs, and moodboards
  • /design-tutorial print-pdf — Build a print layout, PDF report, and run a preflight audit
  • /design-tutorial conversational — Design a chatbot UI, voice interface, and pipeline chain
  • /design-tutorial spatial — Build a visionOS spec, AR overlay, and audit a competitor
  • /design-tutorial compliance — Generate GDPR consent flow, HIPAA audit, and set up project memory
  • /design-tutorial full — Complete tour: all wings, all workflows (~45 min)

Step 1: Detect Track

Parse $ARGUMENTS:

  • If empty → show Welcome Screen (step 2A)
  • If matches a track name → jump to that track's exercise (step 3)
  • If unclear → show Welcome Screen

Step 2A: Welcome Screen

If no track is given, display this orientation:

╔══════════════════════════════════════════════════════════════════╗
║                    Welcome to Naksha                      ║
║                         v4.8.0 · 60 commands                    ║
╚══════════════════════════════════════════════════════════════════╝

Naksha assembles specialist roles for any design task.
You give a goal. The right experts activate automatically.

━━━ What it can do ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  UI & Web Design          /design /design-system /brand-kit
  Figma-Native             /figma-create /figma-responsive /figma-prototype
  Design QA                /design-review /ux-audit /design-handoff
  Social Media             /social-content /social-campaign /social-analytics
  Email                    /email-template /email-campaign
  Data Visualization       /chart-design /dashboard-layout
  Framework Code           /design-framework (React/Vue/Svelte/Next.js/Astro)
  Templates                /design-template (10 production-ready layouts)
  AI Visual Gen            /gen-image /gen-video /gen-audio /gen-moodboard /prompt-refine
  Print / PDF              /pdf-report /print-layout /print-audit
  Frontier Wings           /design-chatbot /design-voice-ui /design-spatial /design-ar-overlay
                           /design-gdpr /design-compliance
  Memory & Pipelines       /naksha-init /naksha-status /pipeline /design-compare /competitive-audit

━━━ Choose a learning track ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  1. quick-start   5 min  See 3 commands in action right now
  2. ui           15 min  Build a component, extract tokens, handoff to dev
  3. figma        15 min  Create in Figma, add responsive variants, prototype
  4. social       15 min  Post design → campaign → analytics dashboard
  5. email        15 min  Welcome template → onboarding sequence
  6. data-viz     15 min  Chart design → full dashboard
  7. ai-visual-gen  15 min  Generate images, video briefs, audio specs, moodboards
  8. print-pdf      15 min  Build a print layout, PDF report, preflight audit
  9. full           45 min  Complete tour: all wings, all workflows (~45 min)
 10. conversational 15 min  Chatbot UI → voice interface → pipeline chaining
 11. spatial        15 min  visionOS spec → AR overlay → competitive audit
 12. compliance     15 min  GDPR consent → HIPAA audit → project memory

Reply with a number or track name to begin.

Read the full file on GitHub · 708 lines

Changes

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.

  1. 3d ago First seen · 708 lines · 28 tokens per session scan A 52a7b6c4ef28

Subscribe to this mod's changes

design-tutorial is a command published in the GitHub repository Adityaraj0421/naksha-studio (316 stars, last pushed 2mo ago), licensed MIT. It adds 28 tokens to every session and 6,143 once invoked, about $0.0001 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.