The IATI Design System is a set of reusable styles and components which should be used in IATI web products, along with guidance on how to use them.

Please see the Storybook site for instructions.

IATI Design System requires Node v20. We recommend installing Node Version Manager and running the command nvm use to use the Node version set in the .nvmrc file at the root of the project.

To run Storybook locally, take the following steps:

1. Install dependencies: npm install
2. Start Storybook: npm start

You will see live updates in the browser when you update styles or stories.

To check the CSS production build, take the following steps:

1. Build the CSS: npm run build
2. View the CSS file: ./dist/css/iati.css.

The check the Storybook production build, take the following steps:

1. Build the Storybook: npm run build:storybook
2. Serve the Storybook: npm run serve:storybook