ecommit

ecommit skills, in any agent

The design playbooks behind the ecommit editor — served live to Claude Code, Cursor and any MCP agent.

1

Install & connect

Installs the CLI globally and links it to your ecommit account via browser auth. On Mac you may need sudo if npm lacks write access to /usr/local.

$ npm install -g ecommit-cli$ ecommit skills login

Permission error? Use sudo npm install -g ecommit-cli

2

Register with your agents

Writes the MCP server entry into Claude Code and Cursor automatically. For Windsurf, Cline, or any other MCP client, add a one-line mcpServers config entry manually.

$ecommit skills install
3

Agents build with taste

Your agent calls list_skills to see the menu, then get_skill to pull the matching playbooks. Skills are served live — always up to date with your plan.

$list_skills → get_skill

The library your agent reads

Ten skills free with any account. Every skill, on any subscription.

bento-grid
Four premium bento grid archetypes
FREE
glass-style-system
Frosted glass tokens for every control
FREE
pricing-cards
Price typography & featured-card mastery
FREE
text-animations
Typewriter, scramble, split-stagger, 3D
FREE
auth-forms
Split layouts, social auth, input anatomy
FREE
toggle-switches
Spring physics, morphing tracks, glow
FREE
non-rectangular-cards
Pill, polygon cut, curved path, SVG clip
FREE
svg-blob-bg
Organic blobs, gooey filters, morphing paths
FREE
compound-button-nested-bg
Nested background blocks in buttons
FREE
blog-cards
Article card variants & badge systems
FREE
premium-hero-content
Badges, headline systems, split fonts
PRO
glass-feature-cards
6-layer inset shadows, fanned stacks
PRO
ios-widgets
9 widget archetypes with 3D tilt grids
PRO
ecomm-checkout
Steps, card preview, order summary
PRO
style-dark-luxury
Near-black, gold, thin serif, grain
PRO
search-ui
Command-palette energy in 3 styles
PRO
floating-cards-over-media
Glass cards anchored over full-bleed media
PRO
neon-glow-svg-ui
Neon filters, charts, orbital rings
PRO
animated-gradient-shader-bg
Mesh gradients via shader or CSS
PRO
cinematic-grain-burn-bg
Film grain, burn glow, streak bands
PRO
prompt-box-design
AI prompt box anatomy & border glow
PRO
3d-card-carousel
Card fans in CSS, Motion or Three.js
PRO
style-modern-maximalism
Editorial density, color blocks, overlap
PRO
style-retro-pixel
Pixel fonts, CRT scanlines, hard shadows
PRO
style-handdrawn-minimal
Thin serif, paper warmth, squiggles
PRO
style-neubrutalism
Thick borders, flat fills, hard shadow
PRO
ecomm-product-page
Gallery, social proof, sticky CTA
PRO
ecomm-product-details
Bundles, subscribe & save, urgency
PRO
blog-listing
Featured hero, sections, sidebar widgets
PRO
blog-article
Two-column article, typography system
PRO
slider-controls
Dot-matrix fill, glow edges, segments
PRO

See the skills in action

Keep scrolling — each step is what your agent produces with that skill loaded.

neon-glow-svg-ui

Holographic 3D globe

A WebGL dot-globe with orbital rings — premium hero material, not a stock illustration. Hover it.

~/your-project
$claude "holographic globe hero"
get_skill(neon-glow-svg-ui)
Three.js points + orbitals

Frequently Asked Questions