A favicon of Medusa UI

Medusa UI

Build consistent user interfaces for e-commerce applications with a React-based design system. Access components, hooks, icons, and utilities.

Visit Medusa UI
A screenshot of Medusa UIVisit

Medusa UI offers a React-based implementation of the Medusa design system, providing a comprehensive toolkit for developers. It includes a collection of components, hooks, utility functions, icons, and classes designed to help you build consistent user interfaces for Medusa Admin and other Medusa applications.

The system is modular, with its core functionalities distributed across several NPM packages:

  • @medusajs/ui: Contains the React components, hooks, and utility functions.
  • @medusajs/ui-preset: Provides a Tailwind CSS preset with all necessary classes.
  • @medusajs/icons: Offers a dedicated set of icons for your projects.

Medusa UI emphasizes simplicity and composability, mirroring Medusa's foundational principles. This approach allows for flexibility in building custom interfaces without an overloaded component API, instead leveraging the native HTML API for underlying elements. It provides the primitives needed to construct polished and effective e-commerce experiences.

Share:

Similar to Medusa UI:

10X your Figma speed with expert-built UI components.
Figma
Accelerate your design workflow with a comprehensive UI kit for Figma. Features best practices, tokenization, WCAG compliance, responsive design, and light/dark modes.
The definitive Figma UI kit. Design faster, elevate skills.
FigmaWebflow
Build stunning Figma designs faster with a massive UI kit. Access 10k+ components, 420+ page examples, variables, Auto Layout 5.0, and save countless hours.
Craft cohesive UIs with speed and precision.
CompanyFigma+1 more
Build consistent, accessible user interfaces rapidly. Access a rich component library, interactive playground, and code snippets for efficient development.

Command Menu