Skip to content
Get packs

Light Paper Technical Design

Builds warm, framed light-mode interfaces with paper textures and precise technical detailing.

Source Download skill
Repository
MengTo/Skills
Stars
7,187
Licence
MIT
Files
4 files

What it does

When installed, the agent follows a specific visual style guide when designing or building user interfaces. It produces light, warm off-white 'paper' surfaces set inside a darker outer frame, with subtle diagonal textures, thin borders, corner brackets, and one restrained accent color. The skill also tells the agent how to keep motion calm and how to pick typography, so its output looks more deliberate and less like a generic white dashboard.

Great for

  • Designers or front-end developers who want a warm, tactile, technical look for a web app or landing page
  • Teams building product mockups, transcript panes, or dashboards that should feel premium but not cold
  • People who want a consistent design direction handed to an AI agent

Skip it if

  • Projects that need a standard brand style or an existing design system, since this skill will push its own look and may conflict with it
  • Anyone expecting it to handle accessibility or contrast checks automatically; the guidance is aesthetic and does not test readability

Try asking

  • “Design a light-mode dashboard with warm paper surfaces and a dark outer frame”
  • “Build a landing page hero with bracketed geometry and subtle diagonal texture”
  • “Create an app mockup with a transcript panel and sidebar in this paper-technical style”
Step-by-step guide: how to use Light Paper Technical DesignInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 4 original files, the MIT licence and an attribution note.

    light-mode-paper-technical.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip light-mode-paper-technical.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip light-mode-paper-technical.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Name the accent color you want, since the skill asks for only one restrained accent
  • Ask for a warmer or cooler paper tone if the default feels off for your brand
  • Check the output's text contrast yourself, because the skill does not verify it

What's inside

  • demo/index.html
  • demo/PROMPT.md
  • demo/source.json
  • SKILL.md

Redistributed unmodified from MengTo/Skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.