GlobalReset

Setup

GlobalReset provides the global styles used by Sky UI's React components. It normalises browser defaults, sets the base typography and colours, and applies consistent box sizing.

Render it once near the root of your application, before the page content:

import { GlobalReset } from '@sky-uk/ui-core';

export default function App({ children }) {
  return (
    <>
      <GlobalReset />
      {children}
    </>
  );
}

Place it in your existing app root or shared layout rather than adding a reset to each component. These styles apply to the whole document, so check how they interact with any existing global styles.

Fonts

GlobalReset includes @font-face declarations for Sky Text regular and bold, and Sky Headline. The font files are served from https://static.skyassets.com/fonts/ and loaded by the browser when used. The default body font is Sky Text; use the documented typography variants to select other styles.

For Next.js App Router integration, see the React Server Components guide.