Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

govuk-frontend

Package Overview
Dependencies
Maintainers
1
Versions
71
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

govuk-frontend

GOV.UK Frontend contains the code you need to start building a user interface for government platforms and services.

  • 5.7.1
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
517K
increased by77.56%
Maintainers
1
Weekly downloads
 
Created

What is govuk-frontend?

The govuk-frontend npm package provides a set of reusable, accessible components and styles for building user interfaces that align with the UK Government Digital Service (GDS) design principles. It is designed to help developers create consistent, user-friendly, and accessible web applications and services.

What are govuk-frontend's main functionalities?

Typography

GOV.UK Frontend provides a set of typography styles that ensure text is readable and accessible. The 'govuk-body' class is used to style paragraphs according to GDS standards.

<p class="govuk-body">This is a paragraph with GOV.UK Frontend styling.</p>

Buttons

GOV.UK Frontend includes styles for buttons that make them visually consistent and accessible. The 'govuk-button' class is used to style buttons.

<button class="govuk-button">Submit</button>

Forms

GOV.UK Frontend provides styles and components for creating accessible forms. The 'govuk-form-group', 'govuk-label', and 'govuk-input' classes are used to style form elements.

<form><div class="govuk-form-group"><label class="govuk-label" for="input-id">Label text</label><input class="govuk-input" id="input-id" name="input-name" type="text"></div></form>

Navigation

GOV.UK Frontend includes styles for navigation elements to ensure they are accessible and consistent. The 'govuk-nav', 'govuk-nav__list', 'govuk-nav__item', and 'govuk-nav__link' classes are used to style navigation menus.

<nav class="govuk-nav"><ul class="govuk-nav__list"><li class="govuk-nav__item"><a class="govuk-nav__link" href="#">Home</a></li><li class="govuk-nav__item"><a class="govuk-nav__link" href="#">About</a></li></ul></nav>

Notifications

GOV.UK Frontend provides components for displaying notifications and alerts. The 'govuk-notification-banner', 'govuk-notification-banner__header', 'govuk-notification-banner__title', and 'govuk-notification-banner__content' classes are used to style notification banners.

<div class="govuk-notification-banner"><div class="govuk-notification-banner__header"><h2 class="govuk-notification-banner__title">Important</h2></div><div class="govuk-notification-banner__content"><p class="govuk-notification-banner__heading">This is a notification message.</p></div></div>

Other packages similar to govuk-frontend

Keywords

FAQs

Package last updated on 11 Oct 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc