- [NHS.UK React Components](#nhsuk-react-components) - [Coming from 0.x?](#coming-from-0x) - [Upgrading to 2.0](#upgrading-to-20) - [Installation](#installation) - [Usage](#usage) - [Storybook](#storybook) - [Maintainers](#maintainers) - [

Downloads in past


2.2.14 months ago4 years agoMinified + gzip package size for nhsuk-react-components in KB


NHS.UK React Components
- Coming from 0.x? - Upgrading to 2.0 - Installation - Usage
- [Storybook](#storybook)
- Maintainers - Preparing Releases
NHS.UK Frontend ported to React
GitHub Actions CI Status Bundle Size

Coming from 0.x?

If you're coming from versions of the library prior to 1.0.0, please give this doc a brief read, as there a number of changes between 0.x release and the 1.0 release.

Upgrading to 2.0

If you're upgrading to 2.0, please be aware we have made some breaking changes. This doc has the details.


You can install this package using either yarn or npm.
npm install --save nhsuk-react-components
# Or
yarn add nhsuk-react-components


import React, { PureComponent } from 'react';

// You can import components from the global module
import { Button } from 'nhsuk-react-components';

// Or you can import components directly
import Button from 'nhsuk-react-components/lib/components/button';

class GetStartedButton extends PureComponent {
  render() {
    return <Button>Click Me!</Button>;


A storybook containing all of the components and their usage can be found here.


We're currently looking for new maintainers! If you have knowledge of React and would be willing to help maintain this library, you can email me (Thomas Judd-Cooper) here.

Preparing Releases

Releases run in CI using github actions.
To prepare a release create a new release TAG in github with your release version.
NPM_TOKEN should be stored in the repositories secrets in GitHub

  • Create a new release with a tag like major.minor.patch against main.
  • If the change is a beta then select pre-release as true, this will make the tag point at beta. Otherwise the tag will be latest.