fusion-design
Looks up Fusion Design Guidelines and applies them to any frontend code in the Fusion ecosystem. USE FOR: layout, spacing, component usage, interaction patterns, any UI implementation decision. DO NOT USE FOR: backend changes, CI/CD, skill authoring, data layer logic.
How do I install this agent skill?
npx skills add https://github.com/equinor/fusion-skills --skill fusion-designIs this agent skill safe to install?
- Gen Agent Trust Hubpass
The skill provides design guidelines for the Fusion ecosystem and allows for local project overrides via a DESIGN.md file. This creates a surface for indirect prompt injection if the local file contains malicious instructions, though the skill itself lacks high-risk capabilities.
- Socketpass
No alerts
- Snykpass
Risk: LOW · No issues
What does this agent skill do?
Fusion Design
When to use
Any time you are writing or reviewing frontend code in the Fusion ecosystem and need to know how it should look, behave, or be structured.
Non-negotiable invariants
These apply to every file you write, regardless of the task — do not wait until you have read the references to honour them, and never emit a "placeholder" that violates them:
- All text uses EDS
<Typography>. Never write a bare<h1>–<h6>,<p>, or<span>for text — not even a temporary title or stub. A page title is<Typography variant="h1">, body text is<Typography variant="body_short">. Seereferences/eds-typography.md. - All spacing uses EDS spacing variables. Never hardcode
pxinpadding/margin/gap. Seereferences/spacing.md.
Instructions
This skill is a lookup. Read all reference files before writing any code — they define mandatory requirements, not optional styling.
1. Read the references
| Topic | File |
|---|---|
| EDS Typography | references/eds-typography.md |
| Navigation — Sidemenu | references/navigation-sidemenu.md |
| Navigation — Tabs | references/navigation-tabs.md |
| Layout — Content area patterns | references/layout.md |
| Layout — Centered content | references/layout-centered-content.md |
| Spacing | references/spacing.md |
| Actions — Action bar, destructive actions, button placement | references/actions.md |
| Empty states | references/empty-states.md |
| Error messages | references/error-messages.md |
| Contextual help (ℹ / ? icons, density) | references/contextual-help.md |
2. Check for a local DESIGN.md
If the app has a DESIGN.md at its root, read it first. It is the authoritative source for that app's design decisions and overrides or supplements the reference rules.
3. Apply
Implement the UI to match the rules. If no DESIGN.md exists and the task requires a layout decision, document it there.
How can the creator link this skill?
Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.
<a href="https://skillzs.dev/skills/equinor/fusion-skills/fusion-design">View fusion-design on skillZs</a>