OpenDesign
Security scan passedConnects your coding agent to OpenDesign on your machine: start design runs, create projects and read the live files of your prototypes.

Gives your coding agent the NVIDIA Elements design system: components, tokens, icons, examples and lint checks for its nve-* markup.
by Nvidia· DesignUnclaimed · Yours? Claim it
4 images
About
NVIDIA Elements is NVIDIA's design system for AI infrastructure, robotics and autonomous vehicle interfaces, built as framework-agnostic Web Components (nve-*) that run in React, Angular, Vue, Svelte, Lit or plain HTML. Its MCP server comes with the Elements CLI (nve) and connects your coding agent to the component APIs, design tokens, icons, examples and template validation, so it builds with Elements instead of guessing the markup. What you can do with it - List every nve-* component and attribute, and read the documentation for the ones you need - Browse the design tokens (semantic CSS custom properties for theming) and icon names - Find starter templates, patterns and examples, and get the ESM imports a template needs - Check HTML or JSON, from files or pasted in, against Elements' lint rules, with locations, severity and suggested fixes - Create a starter project, set up an existing project to use Elements, and check its configuration and dependencies - See the latest Elements package versions and their changelogs - Use its prompts: /artifact for a standalone Elements UI artifact, /doctor to verify your setup, /create-project for a new starter project and /migrate to move off deprecated Elements APIs How it connects It runs on your machine. Install the CLI with NVIDIA's install script or npm install -g @nvidia-elements/cli, then point your agent at nve mcp. Running nve project.setup writes the MCP config for Claude Code, Cursor and Codex and adds Elements' core dependencies to your project. The MCP registry entry starts it with npx @nvidia-elements/cli mcp. It needs Node.js 20 or later. Good to know - No sign-in or API key. - In agents that support MCP Apps, example previews, the icon list and a token explorer show inline in the chat; other agents get the same results as text. - NVIDIA also ships an elements agent skill (nve skills.install) with authoring guidance; the server's prompts load from that same skill.
Once it’s added
“Create an example login form with NVIDIA Elements.”
“Create an Angular todo app with Elements.”
Before you add it
Reads only
Elements component APIs and their documentation · Design tokens, icon names, examples and patterns · Elements package versions and changelogs · Your project's setup and the files you ask it to check
Makes changes · your agent can ask first
Creates Elements starter projects · Sets up a project for Elements: MCP config, core dependencies and package updates · Upgrades the nve CLI when you ask it to
From people who use it
Step by step
Nothing new reaches your agent until a person has looked at it.
Plugins people install alongside NVIDIA Elements.
No reviews yet. Used NVIDIA Elements? Say how it went.
Write a reviewRuns on your machine.
claude_desktop_config.json{
"mcpServers": {
"nvidia-elements": {
"command": "npx",
"args": [
"-y",
"@nvidia-elements/[email protected]",
"mcp"
]
}
}
}Runs on your machine.
Add to VS Codecode --add-mcp '{"name":"nvidia-elements","command":"npx","args":["-y","@nvidia-elements/[email protected]","mcp"]}'copilot mcp add nvidia-elements -- npx -y @nvidia-elements/[email protected] mcp
Runs on your machine.
Add to Cursor.cursor/mcp.json{
"mcpServers": {
"nvidia-elements": {
"command": "npx",
"args": [
"-y",
"@nvidia-elements/[email protected]",
"mcp"
]
}
}
}Runs on your machine.
claude mcp add nvidia-elements -- npx -y @nvidia-elements/[email protected] mcp
Runs on your machine.
codex mcp add nvidia-elements -- npx -y @nvidia-elements/[email protected] mcp
Runs on your machine.
~/.gemini/config/mcp_config.json{
"mcpServers": {
"nvidia-elements": {
"command": "npx",
"args": [
"-y",
"@nvidia-elements/[email protected]",
"mcp"
]
}
}
}Runs on your machine.
gemini mcp add nvidia-elements npx -y @nvidia-elements/[email protected] mcp
Runs on your machine.
Runs on your machine.
opencode mcp add nvidia-elements -- npx -y @nvidia-elements/[email protected] mcp
Runs on your machine.
~/.hermes/config.yaml{
"mcp_servers": {
"nvidia-elements": {
"command": "npx",
"args": [
"-y",
"@nvidia-elements/[email protected]",
"mcp"
]
}
}
}Scanned and passed · checked 5 h ago
“Check src/app.html against the Elements lint rules.”
“Which design tokens should I use to theme this dashboard?”
“Set up this project to use Elements.”
“Migrate this project from deprecated Elements APIs.”
Scanned on every change, and again when our rules improve.
Tell us and a person on the trust team will look at it. Or email [email protected].
Nobody has shared how they use NVIDIA Elements yet.
Security scan
Passed
Safe to install in every agent it supports. Runs on your machine.
Plugins people install alongside NVIDIA Elements.
Connects your coding agent to OpenDesign on your machine: start design runs, create projects and read the live files of your prototypes.
Reviews your frontend code and live pages against the Front-End Checklist rules for accessibility, performance, SEO and security.
Your agent draws editorial diagrams in your brand, as one self-contained HTML and SVG file, and redraws Mermaid, draw.io and Excalidraw.
Gives your agent a live tldraw canvas in the chat, so it can draw diagrams, flows and sketches with you.