Cookies on MHCLG Svelte Component Library

We use some essential cookies to make this service work.

We'd like to set additional cookies so we can remember your settings, understand how people use the service and make improvements.

View cookies

Alpha This service is in development and intended to be production-ready and available for use by the digital community in Autumn 2025.

Get started

Learn how to install and use the MHCLG Svelte Component Library in your SvelteKit projects.

This guide assumes you already have a SvelteKit project set up. If you need to create a new SvelteKit project, follow the official SvelteKit documentation at svelte.dev/docs/kit/creating-a-project

Installation

The component library is publicly available on npm, making installation straightforward:

Terminal

Usage

The component library includes all necessary CSS and JavaScript files. When you install the package, GOV.UK Frontend styles & assets as well as custom styles and assets are automatically included out of the box.

Enable GOV.UK Frontend styles

Add this script tag to your app.html file in the body section. This is required because the GOV.UK Frontend CSS that ships with our component library checks the document body for JavaScript availability to progressively enhance components.

We are working on scoping this JavaScript check within individual components, so this script requirement will be removed in a future version of the library.
app

Importing components

Import components in your Svelte files:

App

Next steps

Support

If you need help or have questions:

Warning This is an alpha release. The API may change as we continue to develop and improve the library based on user feedback.