A Drupal theme for the GOV.UK Design System

This theme utilises the GOV.UK Design System Frontend node module and has Twig template files for the majority of the GOV.UK styles, components and patterns. Fully responsive, multi-column with mobile navigation menu. Full support for Drupal Webforms with client side validation of required fields and exact GOV.UK validation error messages.

It is unlikely that this theme will this meet 100% of your requirements, but it is a good start. You will still have to create/modify Twig/SASS files to get your required look & feel. See the Customising guide.

REQUIREMENTS

  • No extra module is required.
  • Node.js >= V22.0 (optional) See https://nodejs.org
  • Gulp >= V4.0 (optional)

INSTALLATION

The GOV.UK theme works out-of-the-box but if modifications to the SASS files are required then the GOV.UK Design System Frontend node module will need to be installed.

Read the full installation guide

TL;DR

  • Install the theme as usual, see
    https://www.drupal.org/docs/user_guide/en/extend-theme-install.html
  • Change to the theme directory, for example:
    cd web/themes/contrib/govuk_theme
  • Install the Node dependencies:
    npm ci
    (If package-lock.json is not present, use npm install instead.)
  • Compile the Sass files:
    npx gulp
  • To automatically recompile Sass when files change:
    npx gulp watch

This theme includes all the CSS files so Gulp is only required for compiling changes/additions to the SASS files.

CONFIGURATION

Configuration is available in Admin > Appearance.
Read the configuration guide

MOBILE MENU SELECTORS

The theme provides 2 types of mobile menu selectors, set in Configuration.
Mobile menu type
The first (default) is the GDS defined menu link in the navigation area as below:
GDS link

The second, by popular demand, is the traditional hamburger in the top right of the header. This has the advantage of using no display real estate.
Hamburger menu

RELEASES

The 8.x-1.* branch is for the GOV.UK Frontend v4 framework (currently v4.10.0) and will be supported by GDS until December 2024. No further development will be undertaken for this branch.

Final GOV.UK Frontend v4 version

The 2.1.* branch is for the GOV.UK Frontend v5 framework (currently v5.14.0) which includes substantial changes to the v4 framework. See the GOV.UK Frontend v5.x release notes.No further development will be undertaken for this branch.


Final GOV.UK Frontend v5 version
.

govuk v5

The 3.1.x branch is for GOV.UK Frontend v6 framework (currently v6.1.0) which includes substantial changes to the v5 framework and the new colours for the web palette in the GOV.UK brand guidelines. See the GOV.UK Frontend v6.x release notes govuk v6

UPGRADING FROM 8.x-1.* TO 2.1.* OR 3.1.x

After performing the upgrade to 2.1 or 3.1
composer require 'drupal/govuk_theme:^2.1' or composer require 'drupal/govuk_theme:^3.1'.
issue a vendor/bin/drush cr
Any 8.x-1 sub-themes will work without any modifications.

Demo site (D11.3.10)

Supporting organizations: 
AWS Technical Architecture, GDS Assesment, End user training

Project information

Releases