Skip to main content

Axmed Design System

A production-ready React component library built on Ant Design, designed specifically for healthcare B2B applications

Quick start

Get up and running with Axmed Design System in minutes

1

Install the package

Add Axmed Design System to your React project using your preferred package manager:
npm install axmed-design-system
Axmed Design System requires React 18+, Ant Design 5+, and @ant-design/icons 5+ as peer dependencies.
2

Import the CSS

Import the design system’s stylesheet in your application entry point:
import 'axmed-design-system/style.css'
This includes all design tokens (typography, colors, spacing) and component styles.
3

Use components in your app

Start building with Axmed components:
import { AxButton, AxCard, AxText } from 'axmed-design-system'

function App() {
  return (
    <AxCard>
      <AxText variant="heading-lg">Welcome to Axmed</AxText>
      <AxText variant="body-md">
        Build healthcare applications with confidence
      </AxText>
      <AxButton variant="primary">Get Started</AxButton>
    </AxCard>
  )
}

Key features

Everything you need to build professional healthcare applications

21+ Components

From buttons and inputs to complex data tables and navigation systems

Design Tokens

Comprehensive token system for typography, colors, spacing, and motion

TypeScript-First

Full type definitions for every component and prop

Built on Ant Design

Leverage the power and flexibility of Ant Design as a foundation

Storybook Integration

Interactive component development and documentation

Healthcare-Focused

UI patterns designed for B2B healthcare applications

Explore by category

Jump into detailed documentation for each component category

Core Components

Essential building blocks: buttons, text, inputs, and OTP fields

Data Display

Tables, cards, tags, badges, and statistics for presenting information

Navigation

Side navigation, headers, action menus, and step indicators

Overlays

Modals and drawers for focused user interactions

Foundations

Typography, colors, spacing, and motion design tokens

Utilities

Filter bars, file uploaders, brand elements, and more

Ready to build?

Start building professional healthcare applications with Axmed Design System today

View Quickstart Guide

Build docs developers (and LLMs) love