MYDS

Installation

A quick guide to get you up and running with MYDS.

MYDS can be configured in various ways, depending on the requirement of your project. But the simplest way can be done in 3-steps!

Install packages

npm i @govtechmy/myds-react @govtechmy/myds-tailwindcss

Setup CSS stylesheet

You may import the full MYDS stylesheet in one of (2) ways below.

A. Import via JS (Bundler)

// Place in the bundle entry point (eg. index.{ts,js})
import "@govtechmy/myds-tailwindcss/full.css";

B. Import via CSS

/* Place in the CSS entry point */
@import "@govtechmy/myds-tailwindcss/full.css";

For more advanced configuration, please read the Project Configuration

Start using the components!

There are a variety of components available in MYDS. Here is a <Button /> for you to get started!

import { Button } from "@govtechmy/myds-react/button";
 
export default () => {
  return <Button variant="primary-fill">Hello MYDS</Button>;
};

Previous

Introduction

Next

Project Configuration

On this page

Install packages Setup CSS stylesheet A. Import via JS (Bundler)B. Import via CSS Start using the components!