design-minimal
Design Minimal creates a single self-contained HTML file with a restrained visual system—clear hierarchy, strong spacing, and limited palette—ideal for reading-focused dashboards, briefs, handouts, and internal reports. It uses Tailwind CDN for layout and design tokens as CSS variables, with no decorative effects, responsive prefixes, or external dependencies.
Design Minimal generates a single self-contained HTML page with restrained styling for dashboards, briefs, and reports.
AI-generated summary based on this skill's SKILL.md
Install
serejaris/personal-corp-skills/design-minimal · repository language: HTML
git clone https://github.com/serejaris/personal-corp-skills
cp -r personal-corp-skills/skills/design-minimal ~/.claude/skills/design-minimalFrequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
What does Design Minimal do?
Design Minimal creates a single self-contained HTML file with a restrained visual system—clear hierarchy, strong spacing, and limited palette—ideal for reading-focused dashboards, briefs, handouts, and internal reports. It uses Tailwind CDN for layout and design tokens as CSS variables, with no decorative effects, external dependencies, or custom CSS.
Can I build a minimal HTML page with Tailwind using Design Minimal?
Yes. Design Minimal generates clean HTML pages using Tailwind CDN with no custom CSS or decorative effects. The output is a standalone file ready to open in any browser, with layout and spacing built entirely through Tailwind utility classes and CSS variables for design tokens.
Is Design Minimal suitable for dashboards and reports?
Design Minimal is purpose-built for dashboards, briefs, reports, and internal handouts. It prioritizes reading focus and information clarity through strong visual hierarchy, restrained color palettes, and deliberate spacing—making it ideal for presenting data and content without visual distraction.
What dependencies does Design Minimal require?
Design Minimal has no external dependencies. It generates a single HTML file that loads Tailwind via CDN and uses CSS variables for design tokens. The output is completely self-contained and works offline after the initial page load.
Does Design Minimal support responsive or mobile design?
Design Minimal is optimized for desktop-only layouts with strong hierarchy and spacing. It does not include responsive prefixes or mobile adaptations, keeping the design clean and focused on reading-first presentation for internal use.
What license covers Design Minimal?
Design Minimal is released under the MIT license, allowing free use, modification, and distribution in personal and commercial projects with minimal restrictions.
SKILL.md
rendered from the published skill — quoted content, verbatim
Design Minimal
Generate one standalone HTML page with a restrained minimal visual system: clear hierarchy, strong spacing, explicit structure, limited palette, and no decorative effects.
Language
- Match the visible interface language to the user's language and artifact context.
- For Russian pages, write visible UI labels, headings, section names, status explanations, and footer copy in Russian.
- Keep English only for file paths, commands, code identifiers, schema fields, API names, model/tool names, and literal values that must remain copyable.
- If an English technical term is useful for teaching, pair it with a plain-language local label once, then use the local label in the interface.
Hard Contract
- Use one self-contained HTML file.
- Use Tailwind CDN only for layout and component styling.
- Do not write custom CSS rules for components, layout, typography, states, cards, grids, buttons, headers, or
(truncated - see the full file via the links below)
Read as markdown · JSON record · Browse the source repository
File tree — 4 files
skills/design-minimal/README.md
skills/design-minimal/README.ru.md
skills/design-minimal/SKILL.md
skills/design-minimal/assets/illustration.png