Release 6.0.0-beta.0 #6352

govuk-design-system-ci · 2025-10-23T07:05:22Z

Breaking changes

Use GOV.UK brand colours

We’ve updated GOV.UK Frontend to use the web palette defined by the GOV.UK Brand guidelines, as well as the 25% and 50% shades when they exist for a given colour.

Check your service’s colours

Our components now use the colours of the GOV.UK web palette. If you’re using any custom colours, you’ll need to make sure they still work well with the new web palette in terms of accessibility and design. If possible, you should use the GOV.UK brand colours instead.

Use the `govuk-colour` function to access GOV.UK brand colours

You can use the govuk-colour function to fetch colours from the GOV.UK web palette. This function allows you to access both primary colours and their variants, such as tints and shades.

When the function receives only the colour name, it’ll return the primary variant of that colour. For example:

$app-colour: govuk-colour(‘blue’); // Returns the ‘Primary blue’ colour

Use the new $variant parameter of the govuk-colour function to access the tints and shades of a colour defined by the GOV.UK brand.

$component-colour: govuk-colour(‘red’, $variant: ‘tint-25’) // Returns the “Red tint 25%” colour
$other-component-colour: govuk-colour(‘green’, $variant: ‘shade-50’) // Returns the “Green shade 50%” colour

You can find the list of possible colour names in the GOV.UK brand guidelines.

If you’re already using the `govuk-colour` function

If you’re already using the govuk-colour function in your project, colours from the GOV.UK web palette will now be applied automatically when you call the function.

If the colour name exists in the GOV.UK web palette, the function returns the primary variant for that colour. The colour remains the same for‘blue, yellow and orange, but the following colours will see a slight change:

Colour	Old colour hex	New colour hex
`green`	`#00703c`	`#11875a`
`red`	`#d4351c`	`#ca3535`
`purple`	`#4c2c92`	`#54319f`
`brown`	`#b58840`	`#99704a`

Some of the GOV.UK brand colours are slightly different from the colours that were returned by govuk-colour before GOV.UK Frontend v6.0. That means you’ll need to check that the colours still work correctly where you applied them in your project, in terms of accessibility and design.

To make it easier to upgrade, in cases where a colour name does not exist in the GOV.UK brand palette (for example, bright-purple), the function will return the closest colour from the GOV.UK brand palette but produce a deprecation warning. We recommend that you update your calls to govuk-colour with deprecated colour names to use a colour from the GOV.UK brand, such as the one suggested in the deprecation warning message.

govuk-colour now maps colour names that no longer exist from the old palette to the new palette, as described in the following table. You can use this list to assess and update your use of govuk-colour.

Old colour name	Old colour hex	New colour name	New colour hex
`light-pink`	`#f499be`	Magenta tint 50%	`#e59abe`
`pink`	`#d53880`	Primary magenta	`#ca357c`
`light-green`	`#85994b`	Green tint 25%	`#4da583`
`turquoise`	`#28a197`	Primary teal	`#158187`
`light-blue`	`#5694ca`	Blue tint 50%	`#5694ca`
`dark-blue`	`#003078`	Blue shade 50%	`#0f385c`
`light-purple`	`#6f72af`	Purple tint 25%	`#7f65b7`
`bright-purple`	`#912b88`	Magenta shade 25%	`#98285d`
`dark-grey`	`#505a5f`	Black tint 25%	`#484949`
`mid-grey`	`#b1b4b6`	Black tint 80%	`#cecece`
`light-grey`	`#f3f2f1`	Black tint 95%	`#f3f3f3`

If you’re using the `$govuk-colours` variable

We’ve removed the $govuk-colours variable from GOV.UK Frontend, to only allow access to the colours through the govuk-colour function.

If you were accessing the GOV.UK Frontend colours with map-get($govuk-colours, <COLOUR_NAME>), you’ll now need to use govuk-colour(<COLOUR_NAME>).

We made these changes in the following pull requests:

Stop using the `$legacy` parameter in the `govuk-colour` function

We’ve removed the $legacy parameter of the govuk-colour function, so you should remove any usage of it.

We made this change in pull request #6326: Use brand palette through govuk-colour.

Stop using `govuk-tint` and `govuk-shade`

The govuk-tint and govuk-shade functions for applying tints and shades to colours by percentage are now deprecated and no longer work. They now only return the colour you pass to them, as well as a Sass warning. We’ll remove the govuk-tint and govuk-shade functions in the final release of 6.0.0.

We recommend replacing them with tints and shades from the new GOV.UK colour palette that are as close as possible to your existing implementation.

We made this change in pull request #6341: Deactivate govuk-tint and govuk-shade functions.

Fixes

We've made fixes to GOV.UK Frontend in the following pull requests:

#6338: Fix hover state on focused small radios

github-actions · 2025-10-23T07:06:30Z

JavaScript changes to GitHub release

diff --git a/dist/govuk-frontend-5.13.0.min.js b/dist/govuk-frontend-6.0.0-beta.0.min.js
index 27c22c9c1..6eb7090e4 100644
--- a/dist/govuk-frontend-5.13.0.min.js
+++ b/dist/govuk-frontend-6.0.0-beta.0.min.js
@@ -1,4 +1,4 @@
-const version = "5.13.0";
+const version = "6.0.0-beta.0";
 
 function getBreakpoint(t) {
     const e = `--govuk-breakpoint-${t}`;
@@ -1277,4 +1277,4 @@ export {
     initAll,
     isSupported,
     version
-}; //# sourceMappingURL=govuk-frontend-5.13.0.min.js.map
\ No newline at end of file
+}; //# sourceMappingURL=govuk-frontend-6.0.0-beta.0.min.js.map
\ No newline at end of file

Action run for f683bcf

github-actions · 2025-10-23T07:06:31Z

Stylesheets changes to GitHub release

diff --git a/dist/govuk-frontend-5.13.0.min.css b/dist/govuk-frontend-6.0.0-beta.0.min.css
index 3254852c9..db343cfa1 100644
--- a/dist/govuk-frontend-5.13.0.min.css
+++ b/dist/govuk-frontend-6.0.0-beta.0.min.css
@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 :root {
-    --govuk-frontend-version: "5.13.0";
+    --govuk-frontend-version: "6.0.0-beta.0";
     --govuk-breakpoint-mobile: 20rem;
     --govuk-frontend-breakpoint-mobile: var(--govuk-breakpoint-mobile);
     --govuk-breakpoint-tablet: 40.0625rem;
@@ -69,11 +69,11 @@
 }
 
 .govuk-link:visited {
-    color: #4c2c92
+    color: #54319f
 }
 
 .govuk-link:hover {
-    color: #003078
+    color: #0f385c
 }
 
 .govuk-link:active,
@@ -94,7 +94,7 @@
 
 .govuk-link--muted:link,
 .govuk-link--muted:visited {
-    color: #505a5f
+    color: #484949
 }
 
 .govuk-link--muted:active,
@@ -154,7 +154,7 @@
 }
 
 .govuk-link--no-visited-state:hover {
-    color: #003078
+    color: #0f385c
 }
 
 .govuk-link--no-visited-state:active,
@@ -424,7 +424,7 @@
     line-height: 1.1111111111;
     display: block;
     margin-bottom: 5px;
-    color: #505a5f
+    color: #484949
 }
 
 @media print {
@@ -456,7 +456,7 @@
     line-height: 1.1111111111;
     display: block;
     margin-bottom: 5px;
-    color: #505a5f
+    color: #484949
 }
 
 @media print {
@@ -493,7 +493,7 @@
     font-size: 1rem;
     line-height: 1.25;
     display: block;
-    color: #505a5f
+    color: #484949
 }
 
 @media print {
@@ -787,7 +787,7 @@
 }
 
 .govuk-section-break--visible {
-    border-bottom: 1px solid #b1b4b6
+    border-bottom: 1px solid #cecece
 }
 
 .govuk-button-group {
@@ -881,7 +881,7 @@
 
 .govuk-form-group--error {
     padding-left: 15px;
-    border-left: 5px solid #d4351c
+    border-left: 5px solid #ca3535
 }
 
 .govuk-form-group--error .govuk-form-group {
@@ -1077,7 +1077,7 @@
 }
 
 .govuk-template {
-    background-color: #f3f2f1;
+    background-color: #f3f3f3;
     -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
     text-size-adjust: 100%
@@ -1209,7 +1209,7 @@
 }
 
 .govuk-frontend-supported .govuk-accordion {
-    border-bottom: 1px solid #b1b4b6
+    border-bottom: 1px solid #cecece
 }
 
 .govuk-frontend-supported .govuk-accordion__section {
@@ -1295,8 +1295,8 @@
 
 .govuk-frontend-supported .govuk-accordion__show-all:hover {
     color: #0b0c0c;
-    background: #f3f2f1;
-    box-shadow: 0 -2px #f3f2f1, 0 4px #f3f2f1
+    background: #f3f3f3;
+    box-shadow: 0 -2px #f3f3f3, 0 4px #f3f3f3
 }
 
 .govuk-frontend-supported .govuk-accordion__show-all:hover .govuk-accordion__section-toggle-text {
@@ -1309,7 +1309,7 @@
 }
 
 .govuk-frontend-supported .govuk-accordion__show-all:hover .govuk-accordion-nav__chevron:after {
-    color: #f3f2f1
+    color: #f3f3f3
 }
 
 .govuk-frontend-supported .govuk-accordion__show-all:focus {
@@ -1372,7 +1372,7 @@
     width: 100%;
     padding: 10px 0 0;
     border: 0;
-    border-top: 1px solid #b1b4b6;
+    border-top: 1px solid #cecece;
     border-bottom: 10px solid transparent;
     color: #0b0c0c;
     background: none;
@@ -1394,7 +1394,7 @@
 
 .govuk-frontend-supported .govuk-accordion__section-button:hover {
     color: #0b0c0c;
-    background: #f3f2f1
+    background: #f3f3f3
 }
 
 .govuk-frontend-supported .govuk-accordion__section-button:hover .govuk-accordion__section-toggle-text {
@@ -1407,7 +1407,7 @@
 }
 
 .govuk-frontend-supported .govuk-accordion__section-button:hover .govuk-accordion-nav__chevron:after {
-    color: #f3f2f1
+    color: #f3f3f3
 }
 
 .govuk-frontend-supported .govuk-accordion__section-button:focus {
@@ -1537,12 +1537,12 @@
 
 @media (hover:none) {
     .govuk-frontend-supported .govuk-accordion__section-header:hover {
-        border-top-color: #b1b4b6;
+        border-top-color: #cecece;
         box-shadow: inset 0 3px 0 0 #1d70b8
     }
 
     .govuk-frontend-supported .govuk-accordion__section-header:hover .govuk-accordion__section-button {
-        border-top-color: #b1b4b6
+        border-top-color: #cecece
     }
 }
 
@@ -1643,7 +1643,7 @@
     transform: rotate(225deg);
     border: solid;
     border-width: 1px 1px 0 0;
-    border-color: #505a5f
+    border-color: #484949
 }
 
 @supports (border-width:max(0px)) {
@@ -1751,7 +1751,7 @@
     transform: rotate(45deg);
     border: solid;
     border-width: 1px 1px 0 0;
-    border-color: #505a5f
+    border-color: #484949
 }
 
 @supports (border-width:max(0px)) {
@@ -1894,8 +1894,8 @@
     border: 2px solid transparent;
     border-radius: 0;
     color: #fff;
-    background-color: #00703c;
-    box-shadow: 0 2px 0 #002d18;
+    background-color: #11875a;
+    box-shadow: 0 2px 0 #09442d;
     text-align: center;
     vertical-align: top;
     cursor: pointer;
@@ -1943,7 +1943,7 @@
 }
 
 .govuk-button:hover {
-    background-color: #005a30
+    background-color: #0d6544
 }
 
 .govuk-button:active {
@@ -1983,18 +1983,18 @@
 }
 
 .govuk-button[disabled]:hover {
-    background-color: #00703c;
+    background-color: #11875a;
     cursor: not-allowed
 }
 
 .govuk-button[disabled]:active {
     top: 0;
-    box-shadow: 0 2px 0 #002d18
+    box-shadow: 0 2px 0 #09442d
 }
 
 .govuk-button--secondary {
-    background-color: #f3f2f1;
-    box-shadow: 0 2px 0 #929191
+    background-color: #f3f3f3;
+    box-shadow: 0 2px 0 #858686
 }
 
 .govuk-button--secondary,
@@ -2006,16 +2006,16 @@
 }
 
 .govuk-button--secondary:hover {
-    background-color: #dbdad9
+    background-color: #cecece
 }
 
 .govuk-button--secondary:hover[disabled] {
-    background-color: #f3f2f1
+    background-color: #f3f3f3
 }
 
 .govuk-button--warning {
-    background-color: #d4351c;
-    box-shadow: 0 2px 0 #55150b
+    background-color: #ca3535;
+    box-shadow: 0 2px 0 #651b1b
 }
 
 .govuk-button--warning,
@@ -2027,16 +2027,16 @@
 }
 
 .govuk-button--warning:hover {
-    background-color: #aa2a16
+    background-color: #982828
 }
 
 .govuk-button--warning:hover[disabled] {
-    background-color: #d4351c
+    background-color: #ca3535
 }
 
 .govuk-button--inverse {
     background-color: #fff;
-    box-shadow: 0 2px 0 #144e81
+    box-shadow: 0 2px 0 #0f385c
 }
 
 .govuk-button--inverse,
@@ -2048,7 +2048,7 @@
 }
 
 .govuk-button--inverse:hover {
-    background-color: #e8f1f8
+    background-color: #f4f8fb
 }
 
 .govuk-button--inverse:hover[disabled] {
@@ -2103,7 +2103,7 @@
     margin-top: 0;
     margin-bottom: 15px;
     clear: both;
-    color: #d4351c
+    color: #ca3535
 }
 
 @media print {
@@ -2134,7 +2134,7 @@
     font-size: 1rem;
     line-height: 1.25;
     margin-bottom: 15px;
-    color: #505a5f
+    color: #484949
 }
 
 @media print {
@@ -2330,7 +2330,7 @@
 }
 
 .govuk-textarea--error {
-    border-color: #d4351c
+    border-color: #ca3535
 }
 
 .govuk-textarea--error:focus {
@@ -2353,8 +2353,8 @@
 }
 
 .govuk-character-count .govuk-textarea--error:focus {
-    border-color: #d4351c;
-    box-shadow: inset 0 0 0 2px #d4351c
+    border-color: #ca3535;
+    box-shadow: inset 0 0 0 2px #ca3535
 }
 
 .govuk-character-count__message {
@@ -2639,7 +2639,7 @@ screen and (forced-colors:active) {
     margin-bottom: 15px;
     margin-left: 20px;
     padding-left: 35px;
-    border-left: 4px solid #b1b4b6
+    border-left: 4px solid #cecece
 }
 
 @media (min-width:40.0625em) {
@@ -2697,11 +2697,11 @@ screen and (forced-colors:active) {
 .govuk-checkboxes--small .govuk-checkboxes__item:hover .govuk-checkboxes__input:not(:disabled)+.govuk-checkboxes__label:before {
     outline: 3px dashed transparent;
     outline-offset: 1px;
-    box-shadow: 0 0 0 10px #b1b4b6
+    box-shadow: 0 0 0 10px #cecece
 }
 
 .govuk-checkboxes--small .govuk-checkboxes__item:hover .govuk-checkboxes__input:focus+.govuk-checkboxes__label:before {
-    box-shadow: 0 0 0 3px #fd0, 0 0 0 10px #b1b4b6
+    box-shadow: 0 0 0 3px #fd0, 0 0 0 10px #cecece
 }
 
 @media (-ms-high-contrast:active),
@@ -2725,7 +2725,7 @@ screen and (forced-colors:active) {
 .govuk-cookie-banner {
     padding-top: 20px;
     border-bottom: 10px solid transparent;
-    background-color: #f3f2f1
+    background-color: #f3f3f3
 }
 
 .govuk-template--rebranded .govuk-cookie-banner {
@@ -2810,7 +2810,7 @@ screen and (forced-colors:active) {
 }
 
 .govuk-input--error {
-    border-color: #d4351c
+    border-color: #ca3535
 }
 
 .govuk-input--error:focus {
@@ -2888,7 +2888,7 @@ screen and (forced-colors:active) {
     height: 2.5rem;
     padding: 5px;
     border: 2px solid #0b0c0c;
-    background-color: #f3f2f1;
+    background-color: #f3f3f3;
     text-align: center;
     white-space: nowrap;
     cursor: default;
@@ -3050,7 +3050,7 @@ screen and (forced-colors:active) {
 
 @media screen\0 {
     .govuk-details {
-        border-left: 10px solid #b1b4b6
+        border-left: 10px solid #cecece
     }
 
     .govuk-details__summary {
@@ -3081,7 +3081,7 @@ screen and (forced-colors:active) {
     }
 
     .govuk-details__summary:hover {
-        color: #003078
+        color: #0f385c
     }
 
     .govuk-details__summary:focus {
@@ -3152,7 +3152,7 @@ screen and (forced-colors:active) {
     }
 
     .govuk-details__text {
-        border-left: 5px solid #b1b4b6
+        border-left: 5px solid #cecece
     }
 }
 
@@ -3166,7 +3166,7 @@ screen and (forced-colors:active) {
     color: #0b0c0c;
     padding: 15px;
     margin-bottom: 30px;
-    border: 5px solid #d4351c
+    border: 5px solid #ca3535
 }
 
 @media print {
@@ -3292,15 +3292,15 @@ screen and (forced-colors:active) {
 
 .govuk-error-summary__list a:link,
 .govuk-error-summary__list a:visited {
-    color: #d4351c
+    color: #ca3535
 }
 
 .govuk-error-summary__list a:hover {
-    color: #942514
+    color: #8d2525
 }
 
 .govuk-error-summary__list a:active {
-    color: #d4351c
+    color: #ca3535
 }
 
 .govuk-error-summary__list a:focus {
@@ -3466,7 +3466,8 @@ screen and (forced-colors:active) {
     display: block;
     margin-bottom: 10px;
     padding: 15px 10px;
-    background-color: #fff;
+    color: #fff;
+    background-color: #1d70b8;
     text-align: left;
     word-wrap: break-word;
     overflow-wrap: break-word
@@ -3481,8 +3482,8 @@ screen and (forced-colors:active) {
 .govuk-file-upload-button {
     width: 100%;
     padding: 18px;
-    border: 2px solid #b1b4b6;
-    background-color: #f3f2f1;
+    border: 2px solid #cecece;
+    background-color: #fff;
     cursor: pointer
 }
 
@@ -3493,19 +3494,19 @@ screen and (forced-colors:active) {
 }
 
 .govuk-file-upload-button .govuk-file-upload-button__pseudo-button {
-    background-color: #fff
+    background-color: #f3f3f3
 }
 
 .govuk-file-upload-button:hover {
-    background-color: #c1c3c5
+    border-color: #858686
 }
 
 .govuk-file-upload-button:hover .govuk-file-upload-button__pseudo-button {
-    background-color: #dbdad9
+    background-color: #cecece
 }
 
 .govuk-file-upload-button:hover .govuk-file-upload-button__status {
-    background-color: #d2e2f1
+    background-color: #1d70b8
 }
 
 .govuk-file-upload-button:active,
@@ -3513,7 +3514,7 @@ screen and (forced-colors:active) {
     border: 2px solid #0b0c0c;
     outline: 3px solid #fd0;
     outline-offset: 0;
-    background-color: #c1c3c5;
+    background-color: #f3f3f3;
     box-shadow: inset 0 0 0 2px
 }
 
@@ -3527,7 +3528,7 @@ screen and (forced-colors:active) {
 .govuk-file-upload-button:focus:hover .govuk-file-upload-button__pseudo-button {
     border-color: #fd0;
     outline: 3px solid transparent;
-    background-color: #f3f2f1;
+    background-color: #cecece;
     box-shadow: inset 0 0 0 1px #fd0
 }
 
@@ -3537,18 +3538,18 @@ screen and (forced-colors:active) {
 }
 
 .govuk-file-upload-button--empty .govuk-file-upload-button__pseudo-button {
-    background-color: #f3f2f1
+    background-color: #f3f3f3
 }
 
 .govuk-file-upload-button--empty .govuk-file-upload-button__status {
-    color: #0c2d4a;
-    background-color: #bbd4ea
+    color: #0b0c0c;
+    background-color: #d2e2f1
 }
 
 .govuk-file-upload-button--empty:active,
 .govuk-file-upload-button--empty:focus,
 .govuk-file-upload-button--empty:hover {
-    background-color: #f3f2f1
+    background-color: #f3f3f3
 }
 
 .govuk-file-upload-button--empty:active .govuk-file-upload-button__status,
@@ -3562,21 +3563,8 @@ screen and (forced-colors:active) {
     border-color: #0b0c0c
 }
 
-.govuk-file-upload-button--dragging.govuk-file-upload-button {
-    background-color: #c1c3c5
-}
-
 .govuk-file-upload-button--dragging.govuk-file-upload-button--empty {
-    background-color: #f3f2f1
-}
-
-.govuk-file-upload-button--dragging.govuk-file-upload-button--empty .govuk-file-upload-button__pseudo-button,
-.govuk-file-upload-button--dragging.govuk-file-upload-button--empty:not(:disabled) .govuk-file-upload-button__status {
-    background-color: #fff
-}
-
-.govuk-file-upload-button--dragging .govuk-file-upload-button__pseudo-button {
-    background-color: #dbdad9
+    background-color: #f3f3f3
 }
 
 .govuk-file-upload-button:disabled {
@@ -3586,11 +3574,11 @@ screen and (forced-colors:active) {
 }
 
 .govuk-file-upload-button:disabled .govuk-file-upload-button__pseudo-button {
-    background-color: #f3f2f1
+    background-color: #f3f3f3
 }
 
 .govuk-file-upload-button:disabled .govuk-file-upload-button__status {
-    background-color: #bbd4ea
+    background-color: #d2e2f1
 }
 
 .govuk-footer {
@@ -3604,7 +3592,7 @@ screen and (forced-colors:active) {
     padding-bottom: 15px;
     border-top: 10px solid #1d70b8;
     color: #0b0c0c;
-    background: #f3f2f1
+    background: #f3f3f3
 }
 
 @media print {
@@ -3713,7 +3701,7 @@ screen and (forced-colors:active) {
 .govuk-footer__section-break {
     margin: 0 0 30px;
     border: 0;
-    border-bottom: 1px solid #b1b4b6
+    border-bottom: 1px solid #cecece
 }
 
 @media (min-width:40.0625em) {
@@ -3821,7 +3809,7 @@ screen and (forced-colors:active) {
 .govuk-footer__heading {
     margin-bottom: 30px;
     padding-bottom: 20px;
-    border-bottom: 1px solid #b1b4b6
+    border-bottom: 1px solid #cecece
 }
 
 @media (max-width:40.0525em) {
@@ -4490,7 +4478,7 @@ screen and (forced-colors:active) {
     margin-top: 20px;
     margin-bottom: 20px;
     clear: both;
-    border-left: 10px solid #b1b4b6
+    border-left: 10px solid #cecece
 }
 
 @media print {
@@ -4698,7 +4686,7 @@ screen and (forced-colors:active) {
 }
 
 .govuk-notification-banner__link:hover {
-    color: #003078
+    color: #0f385c
 }
 
 .govuk-notification-banner__link:active,
@@ -4707,21 +4695,21 @@ screen and (forced-colors:active) {
 }
 
 .govuk-notification-banner--success {
-    border-color: #00703c;
-    background-color: #00703c
+    border-color: #11875a;
+    background-color: #11875a
 }
 
 .govuk-notification-banner--success .govuk-notification-banner__link:link,
 .govuk-notification-banner--success .govuk-notification-banner__link:visited {
-    color: #00703c
+    color: #11875a
 }
 
 .govuk-notification-banner--success .govuk-notification-banner__link:hover {
-    color: #004e2a
+    color: #0c5f3f
 }
 
 .govuk-notification-banner--success .govuk-notification-banner__link:active {
-    color: #00703c
+    color: #11875a
 }
 
 .govuk-notification-banner--success .govuk-notification-banner__link:focus {
@@ -4799,7 +4787,7 @@ screen and (forced-colors:active) {
 .govuk-pagination__item:hover,
 .govuk-pagination__next:hover,
 .govuk-pagination__prev:hover {
-    background-color: #f3f2f1
+    background-color: #f3f3f3
 }
 
 .govuk-pagination__item {
@@ -4867,7 +4855,7 @@ screen and (forced-colors:active) {
 .govuk-pagination__item--ellipses,
 .govuk-pagination__item--ellipsis {
     font-weight: 700;
-    color: #505a5f
+    color: #484949
 }
 
 .govuk-pagination__item--ellipses:hover,
@@ -4933,7 +4921,7 @@ screen and (forced-colors:active) {
 .govuk-pagination__icon {
     width: .9375rem;
     height: .8125rem;
-    color: #505a5f;
+    color: #484949;
     fill: currentcolor;
     forced-color-adjust: auto
 }
@@ -4966,7 +4954,7 @@ screen and (forced-colors:active) {
 }
 
 .govuk-pagination--block .govuk-pagination__prev+.govuk-pagination__next {
-    border-top: 1px solid #b1b4b6
+    border-top: 1px solid #cecece
 }
 
 .govuk-pagination--block .govuk-pagination__link-title:after {
@@ -5033,7 +5021,7 @@ screen and (forced-colors:active) {
 
 .govuk-panel--confirmation {
     color: #fff;
-    background: #00703c
+    background: #11875a
 }
 
 @media print {
@@ -5112,8 +5100,8 @@ screen and (forced-colors:active) {
     margin-top: -2px;
     margin-bottom: -3px;
     padding: 2px 8px 3px;
-    color: #0c2d4a;
-    background-color: #bbd4ea;
+    color: #0b0c0c;
+    background-color: #d2e2f1;
     text-decoration: none;
     overflow-wrap: break-word
 }
@@ -5145,59 +5133,59 @@ screen and (forced-colors:active) {
 }
 
 .govuk-tag--grey {
-    color: #282d30;
-    background-color: #e5e6e7
+    color: #484949;
+    background-color: #f3f3f3
 }
 
 .govuk-tag--purple {
-    color: #491644;
-    background-color: #efdfed
+    color: #2a1950;
+    background-color: #ddd6ec
 }
 
 .govuk-tag--turquoise {
-    color: #10403c;
-    background-color: #d4ecea
+    color: #0b4144;
+    background-color: #d0e6e7
 }
 
 .govuk-tag--blue {
-    color: #0c2d4a;
-    background-color: #bbd4ea
+    color: #0b0c0c;
+    background-color: #d2e2f1
 }
 
 .govuk-tag--light-blue {
-    color: #0c2d4a;
-    background-color: #e8f1f8
+    color: #0f385c;
+    background-color: #f4f8fb
 }
 
 .govuk-tag--yellow {
-    color: #594d00;
-    background-color: #fff7bf
+    color: #806f00;
+    background-color: #fff8cc
 }
 
 .govuk-tag--orange {
-    color: #6e3619;
-    background-color: #fcd6c3
+    color: #7a3c1c;
+    background-color: #fde4d7
 }
 
 .govuk-tag--red {
-    color: #2a0b06;
-    background-color: #f4cdc6
+    color: #651b1b;
+    background-color: #f4d7d7
 }
 
 .govuk-tag--pink {
-    color: #6b1c40;
-    background-color: #f9e1ec
+    color: #651b3e;
+    background-color: #f4d7e5
 }
 
 .govuk-tag--green {
-    color: #005a30;
-    background-color: #cce2d8
+    color: #09442d;
+    background-color: #cfe7de
 }
 
 .govuk-phase-banner {
     padding-top: 10px;
     padding-bottom: 10px;
-    border-bottom: 1px solid #b1b4b6
+    border-bottom: 1px solid #cecece
 }
 
 .govuk-phase-banner__content {
@@ -5404,7 +5392,7 @@ screen and (forced-colors:active) {
     margin-bottom: 15px;
     margin-left: 20px;
     padding-left: 35px;
-    border-left: 4px solid #b1b4b6
+    border-left: 4px solid #cecece
 }
 
 @media (min-width:40.0625em) {
@@ -5460,11 +5448,11 @@ screen and (forced-colors:active) {
 .govuk-radios--small .govuk-radios__item:hover .govuk-radios__input:not(:disabled)+.govuk-radios__label:before {
     outline: 4px dashed transparent;
     outline-offset: 1px;
-    box-shadow: 0 0 0 10px #b1b4b6
+    box-shadow: 0 0 0 10px #cecece
 }
 
 .govuk-radios--small .govuk-radios__item:hover .govuk-radios__input:focus+.govuk-radios__label:before {
-    box-shadow: 0 0 0 4px 0 0 0 10px #fd0 #b1b4b6
+    box-shadow: 0 0 0 4px #fd0, 0 0 0 10px #cecece
 }
 
 @media (-ms-high-contrast:active),
@@ -5542,7 +5530,7 @@ screen and (forced-colors:active) {
 }
 
 .govuk-select--error {
-    border-color: #d4351c
+    border-color: #ca3535
 }
 
 .govuk-select--error:focus {
@@ -5550,8 +5538,8 @@ screen and (forced-colors:active) {
 }
 
 .govuk-service-navigation {
-    border-bottom: 1px solid #b1b4b6;
-    background-color: #f3f2f1
+    border-bottom: 1px solid #cecece;
+    background-color: #f3f3f3
 }
 
 .govuk-template--rebranded .govuk-service-navigation {
@@ -5576,7 +5564,7 @@ screen and (forced-colors:active) {
 .govuk-service-navigation__service-name {
     position: relative;
     margin: 10px 0;
-    border: 0 solid #1a65a6
+    border: 0 solid #16548a
 }
 
 @media (min-width:40.0625em) {
@@ -5680,7 +5668,7 @@ screen and (forced-colors:active) {
 }
 
 .govuk-service-navigation__link:hover {
-    color: #003078
+    color: #0f385c
 }
 
 .govuk-service-navigation__link:active,
@@ -5689,7 +5677,7 @@ screen and (forced-colors:active) {
 }
 
 .govuk-service-navigation__link:not(:hover):not(:focus) {
-    color: #1a65a6
+    color: #16548a
 }
 
 .govuk-service-navigation__service-name {
@@ -5766,7 +5754,7 @@ screen and (forced-colors:active) {
     margin: 10px 0;
     padding: 0;
     border: 0;
-    color: #1a65a6;
+    color: #16548a;
     background: none;
     word-break: break-all;
     cursor: pointer;
@@ -6070,7 +6058,7 @@ screen and (forced-colors:active) {
 }
 
 .govuk-summary-list__row {
-    border-bottom: 1px solid #b1b4b6
+    border-bottom: 1px solid #cecece
 }
 
 @media (max-width:40.0525em) {
@@ -6174,7 +6162,7 @@ screen and (forced-colors:active) {
     .govuk-summary-list__actions-list-item {
         margin-right: 10px;
         padding-right: 10px;
-        border-right: 1px solid #b1b4b6
+        border-right: 1px solid #cecece
     }
 
     .govuk-summary-card__action:last-child,
@@ -6195,7 +6183,7 @@ screen and (forced-colors:active) {
 
     .govuk-summary-card__action:not(:first-child),
     .govuk-summary-list__actions-list-item:not(:first-child) {
-        border-left: 1px solid #b1b4b6
+        border-left: 1px solid #cecece
     }
 
     .govuk-summary-card__action:first-child,
@@ -6238,7 +6226,7 @@ screen and (forced-colors:active) {
 
 .govuk-summary-card {
     margin-bottom: 20px;
-    border: 1px solid #b1b4b6
+    border: 1px solid #cecece
 }
 
 @media (min-width:40.0625em) {
@@ -6250,7 +6238,7 @@ screen and (forced-colors:active) {
 .govuk-summary-card__title-wrapper {
     padding: 15px;
     border-bottom: 1px solid transparent;
-    background-color: #f3f2f1
+    background-color: #f3f3f3
 }
 
 @media (min-width:40.0625em) {
@@ -6415,7 +6403,7 @@ screen and (-ms-high-contrast:active) {
 .govuk-table__cell,
 .govuk-table__header {
     padding: 10px 20px 10px 0;
-    border-bottom: 1px solid #b1b4b6;
+    border-bottom: 1px solid #cecece;
     text-align: left;
     vertical-align: top
 }
@@ -6636,11 +6624,11 @@ screen and (-ms-high-contrast:active) {
 }
 
 .govuk-tabs__tab:visited {
-    color: #4c2c92
+    color: #54319f
 }
 
 .govuk-tabs__tab:hover {
-    color: #003078
+    color: #0f385c
 }
 
 .govuk-tabs__tab:active,
@@ -6659,7 +6647,7 @@ screen and (-ms-high-contrast:active) {
 
     .govuk-frontend-supported .govuk-tabs__list {
         margin-bottom: 0;
-        border-bottom: 1px solid #b1b4b6
+        border-bottom: 1px solid #cecece
     }
 
     .govuk-frontend-supported .govuk-tabs__list:after {
@@ -6679,7 +6667,7 @@ screen and (-ms-high-contrast:active) {
         margin-left: 0;
         padding: 10px 20px;
         float: left;
-        background-color: #f3f2f1;
+        background-color: #f3f3f3;
         text-align: center
     }
 
@@ -6692,7 +6680,7 @@ screen and (-ms-high-contrast:active) {
         margin-top: -5px;
         margin-bottom: -1px;
         padding: 14px 19px 16px;
-        border: 1px solid #b1b4b6;
+        border: 1px solid #cecece;
         border-bottom: 0;
         background-color: #fff
     }
@@ -6751,7 +6739,7 @@ screen and (-ms-high-contrast:active) {
     .govuk-frontend-supported .govuk-tabs__panel {
         margin-bottom: 0;
         padding: 30px 20px;
-        border: 1px solid #b1b4b6;
+        border: 1px solid #cecece;
         border-top: 0
     }
 
@@ -6810,15 +6798,15 @@ screen and (-ms-high-contrast:active) {
     margin-bottom: 0;
     padding-top: 10px;
     padding-bottom: 10px;
-    border-bottom: 1px solid #b1b4b6
+    border-bottom: 1px solid #cecece
 }
 
 .govuk-task-list__item:first-child {
-    border-top: 1px solid #b1b4b6
+    border-top: 1px solid #cecece
 }
 
 .govuk-task-list__item--with-link:hover {
-    background: #f3f2f1
+    background: #f3f3f3
 }
 
 .govuk-task-list__name-and-hint {
@@ -6848,7 +6836,7 @@ screen and (-ms-high-contrast:active) {
 }
 
 .govuk-task-list__status--cannot-start-yet {
-    color: #505a5f
+    color: #484949
 }
 
 .govuk-task-list__link:after {
@@ -6863,7 +6851,7 @@ screen and (-ms-high-contrast:active) {
 
 .govuk-task-list__hint {
     margin-top: 5px;
-    color: #505a5f
+    color: #484949
 }
 
 .govuk-warning-text {
@@ -8412,4 +8400,4 @@ screen and (-ms-high-contrast:active) {
     }
 }
 
-/*# sourceMappingURL=govuk-frontend-5.13.0.min.css.map */
\ No newline at end of file
+/*# sourceMappingURL=govuk-frontend-6.0.0-beta.0.min.css.map */
\ No newline at end of file

Action run for f683bcf

github-actions · 2025-10-23T07:06:32Z

Other changes to GitHub release

diff --git a/dist/VERSION.txt b/dist/VERSION.txt
index 26f30f79c..8a7e834d0 100644
--- a/dist/VERSION.txt
+++ b/dist/VERSION.txt
@@ -1 +1 @@
-5.13.0
+6.0.0-beta.0

Action run for f683bcf

github-actions · 2025-10-23T07:11:01Z

📋 Stats

No changes to any distributed file sizes!

Action run for f683bcf

Release 6.0.0-beta.0

abcc44a

govuk-design-system-ci requested a review from a team as a code owner October 23, 2025 07:05

govuk-design-system-ci temporarily deployed to govuk-frontend-pr-6352 October 23, 2025 07:05 Inactive

Add 'staying up to date' paragraph to changelog entry

f683bcf

govuk-design-system-ci temporarily deployed to govuk-frontend-pr-6352 October 23, 2025 08:22 Inactive

romaricpascal approved these changes Oct 23, 2025

View reviewed changes

owenatgov approved these changes Oct 23, 2025

View reviewed changes

owenatgov merged commit 222db11 into main Oct 23, 2025
50 checks passed

owenatgov deleted the release-6.0.0-beta.0 branch October 23, 2025 09:12

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Release 6.0.0-beta.0 #6352

Release 6.0.0-beta.0 #6352

Uh oh!

govuk-design-system-ci commented Oct 23, 2025

Uh oh!

github-actions bot commented Oct 23, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Oct 23, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Oct 23, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Oct 23, 2025 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Release 6.0.0-beta.0 #6352

Release 6.0.0-beta.0 #6352

Uh oh!

Conversation

govuk-design-system-ci commented Oct 23, 2025

Breaking changes

Use GOV.UK brand colours

Check your service’s colours

Use the govuk-colour function to access GOV.UK brand colours

If you’re already using the govuk-colour function

If you’re using the $govuk-colours variable

Stop using the $legacy parameter in the govuk-colour function

Stop using govuk-tint and govuk-shade

Fixes

Uh oh!

github-actions bot commented Oct 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

JavaScript changes to GitHub release

Uh oh!

github-actions bot commented Oct 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Stylesheets changes to GitHub release

Uh oh!

github-actions bot commented Oct 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Other changes to GitHub release

Uh oh!

github-actions bot commented Oct 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📋 Stats

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Use the `govuk-colour` function to access GOV.UK brand colours

If you’re already using the `govuk-colour` function

If you’re using the `$govuk-colours` variable

Stop using the `$legacy` parameter in the `govuk-colour` function

Stop using `govuk-tint` and `govuk-shade`

github-actions bot commented Oct 23, 2025 •

edited

Loading

github-actions bot commented Oct 23, 2025 •

edited

Loading

github-actions bot commented Oct 23, 2025 •

edited

Loading

github-actions bot commented Oct 23, 2025 •

edited

Loading