React Component Library

A collection of React components written for Royal Navy web applications.


The Royal Navy React Component Library is available as an NPM package.

// npm
npm install @royalnavy/react-component-library

// yarn
yarn add @royalnavy/react-component-library

NOTE: As of 2.16.0 the styled-components package is now a required peerDependency.


import React from 'react'
import ReactDOM from 'react-dom'
import '@royalnavy/fonts'
import { GlobalStyleProvider, Button } from '@royalnavy/react-component-library'

function App() {
  return (
      <Button variant="primary">
        Hello, World!

ReactDOM.render(<App />, document.querySelector('#app'))

<GlobalStyleProvider />

This context provider component applies global Royal Navy Design System styles to your application (resets, normalize and fonts). You should wrap the root of your app in this component.