swiss-creative-mode-template

Original：🇺🇸 English

Translated

Swiss-inspired creative-mode presentation template skill with bold editorial typography, high-contrast geometric cards, interactive slide navigation, theme switching, hotspot overlays, and palette choreography in a single-file HTML artifact. Use when users ask for a premium presentation-style landing, a Swiss/brutalist deck look, or a creative launch page with rich interactions.

2installs

Sourcenexu-io/open-design

Added on2026-05-11

NPX Install

npx skill4agent add nexu-io/open-design swiss-creative-mode-template

SKILL.md Content

View Translation Comparison →

Swiss Creative Mode Template

Produce a premium Swiss/editorial-style HTML template with strong visual rhythm and meaningful interactions, then emit it as a single-file artifact.

Resource map

text

swiss-creative-mode-template/
├── SKILL.md
├── assets/
│   └── template.html
├── references/
│   └── checklist.md
└── example.html

Workflow

Read active
```
DESIGN.md
```
and map palette/type/layout decisions into root CSS variables.
Copy
```
assets/template.html
```
to
```
index.html
```
.
Keep this structure intact:
- Hero scene with bold title and geometric frame.
- Four-step process card row.
- Stack/architecture diagram scene.
Keep these interactions working:
- Prev/next slide navigation + dot nav.
- Theme toggle (paper/dark).
- Palette cycle button (changes accent colors across the template).
- Hotspot toggle for annotations/details.
Keep output self-contained (
```
<!doctype html>
```
, inline CSS/JS, no external runtime dependency).
Validate against
```
references/checklist.md
```
before emitting.

Output contract

One short sentence before artifact, then:

xml

<artifact identifier="swiss-creative-mode" type="text/html" title="Swiss Creative Mode Template">
<!doctype html>
<html>...</html>
</artifact>