GOV.UK Vue

GOV.UK Vue is a Vue 3 component library for GOV.UK Frontend. It enables you to build Vue apps based on the GOV.UK Design System.

!An illustration of a big green 'Start now' button connected to its Vue code

You can use GOV.UK Vue to build easy-to-use, accessible apps whether you're working on a government service or not.

GOV.UK Vue is a community resource of the GOV.UK Design System. The Design System team is not responsible for it and cannot support you with using it. Contact Matt Eason directly if you need help or you want to request a feature.

Please share any feedback by starting a discussion or raise an issue for any problems.

Demo

!A simple GOV.UK-style page with a text input component

See a minimal example of a GOV.UK-style page using this library.

The source for this demo is available in the govuk-vue-minimal-example repo.

Getting started and documentation

govukvue.org has detailed instructions on how to install GOV.UK Vue, including how to use GOV.UK Vue with Nuxt.

There's also detailed documentation and examples for every component.

If you need any help getting set up, get in touch.

Goals

GOV.UK Vue aims to provide all of the GOV.UK Frontend components as Vue components.

In almost all cases GOV.UK Vue provides every option available in the original Nunjucks templates and outputs the same HTML (though there are some differences).

Styling is entirely provided by GOV.UK Frontend. GOV.UK Vue does not reimplement any of the Frontend styling, or provide any of its own.

Accessibility is the #1 priority of GOV.UK Vue. It provides full support for all accessibility features in GOV.UK Frontend, and any accessibility issues will be given priority over new features.

All JavaScript functionality from GOV.UK Frontend, such as accordions and character counts, is reimplemented in TypeScript within individual Vue components. No JavaScript files from GOV.UK Frontend are used. No external dependencies are used in components beyond Vue.

License and credit

This project is licenced under the MIT License. An acknowledgement in your README.md is appreciated but not necessary.

Even if you don't need any help, I'd love to know what you're using GOV.UK Vue for - please get in touch if you use it.

Sponsoring GOV.UK Vue

GOV.UK Vue is built and maintained by Matt Eason as a community resource. It's not maintained or supported by GDS.

If you find this project useful, I'd really appreciate your support through Ko-fi or GitHub Sponsors.