Typography

GOV.UK typography components - paragraphs, headings and lists etc.

fast_gov_uk.design_system.typography.A(text, href: str = '#', visited: bool = False, inverse=False, newtab=False, **kwargs) → FT

GOV.UK Link component. Links are blue and underlined by default.

Examples

>>> a = ds.A("test")
>>> str(a)
'<a href="#" class="govuk-link">test</a>'
>>> a = ds.A("test", href="/test")
>>> str(a)
'<a href="/test" class="govuk-link">test</a>'
Parameters:

  • text – The text to display in the link.

  • href (str, optional) – The URL the link points to. Defaults to “#”.

  • visited (bool, optional) – If True, applies a visited style. Defaults to False.

  • inverse (bool, optional) – If True, applies an inverse style. Defaults to False.

  • newtab (bool, optional) – If True, opens the link in a new tab. Defaults to False.

  • **kwargs – Additional keyword arguments.

Returns:

A FastHTML link component.

Return type:

FT

fast_gov_uk.design_system.typography.H1(text, size='l', caption='', **kwargs) → FT

GOV.UK H1 component.

Examples

>>> h1 = ds.H1("Test")
>>> str(h1)
'<h1 class="govuk-heading-l">Test</h1>'
>>> h1 = ds.H1("Test", size="xl")
>>> str(h1)
'<h1 class="govuk-heading-xl">Test</h1>'
>>> h1 = ds.H1("Test", caption="test caption")
>>> str(h1)
'<h1 class="govuk-heading-l">Test<span class="govuk-caption-l">test caption</span></h1>'
Parameters:

  • text – The text to display in the header.

  • size (str, optional) – The size of the header. Defaults to “l”.

  • caption (str, optional) – Caption to go with the heading. Defaults to “”.

  • **kwargs – Additional keyword arguments.

Returns:

A FastHTML H1 component.

Return type:

FT

fast_gov_uk.design_system.typography.H2(text, size='m', caption='', **kwargs) → FT

GOV.UK H2 component.

Examples

>>> h2 = ds.H2("Test")
>>> str(h2)
'<h2 class="govuk-heading-l">Test</h2>'
>>> h2 = ds.H2("Test", size="xl")
>>> str(h2)
'<h2 class="govuk-heading-xl">Test</h2>'
>>> h2 = ds.H2("Test", caption="test caption")
>>> str(h2)
'<h2 class="govuk-heading-l">Test<span class="govuk-caption-l">test caption</span></h2>'
Parameters:

  • text – The text to display in the header.

  • size (str, optional) – The size of the header. Defaults to “l”.

  • caption (str, optional) – Caption to go with the heading. Defaults to “”.

  • **kwargs – Additional keyword arguments.

Returns:

A FastHTML H2 component.

Return type:

FT

fast_gov_uk.design_system.typography.H3(text, size='s', caption='', **kwargs) → FT

GOV.UK H2 component.

Examples

>>> h2 = ds.H2("Test")
>>> str(h2)
'<h2 class="govuk-heading-l">Test</h2>'
>>> h2 = ds.H2("Test", size="xl")
>>> str(h2)
'<h2 class="govuk-heading-xl">Test</h2>'
>>> h2 = ds.H2("Test", caption="test caption")
>>> str(h2)
'<h2 class="govuk-heading-l">Test<span class="govuk-caption-l">test caption</span></h2>'
Parameters:

  • text – The text to display in the header.

  • size (str, optional) – The size of the header. Defaults to “l”.

  • caption (str, optional) – Caption to go with the heading. Defaults to “”.

  • **kwargs – Additional keyword arguments.

Returns:

A FastHTML H2 component.

Return type:

FT

fast_gov_uk.design_system.typography.P(*content, lead=False, small=False, **kwargs) → FT

GOV.UK Paragraph component. The default paragraph font size is 19px.

Examples

>>> p = ds.P("test")
>>> str(p)
'<p class="govuk-body">test</p>'
>>> p = ds.P("test", lead=True)
>>> str(p)
'<p class="govuk-body-l">test</p>'
>>> p = ds.P("test", small=True)
>>> str(p)
'<p class="govuk-body-s">test</p>'
Parameters:

  • *content – The list of content to display in the paragraph.

  • lead (bool, optional) – If True, applies a lead style. Defaults to False.

  • small (bool, optional) – If True, applies a small style. Defaults to False.

  • **kwargs – Additional keyword arguments.

Returns:

A FastHTML paragraph component.

Return type:

FT

fast_gov_uk.design_system.typography.Li(*args, **kwargs) → FT

GOV.UK list item component. Used to pass-in list items into Ul().

Parameters:

  • *args – Items to include in the list.

  • **kwargs – Additional attributes for the list.

Returns:

A FastHTML list item component.

Return type:

FT

fast_gov_uk.design_system.typography.Ul(*args, bullet=False, numbered=False, spaced=False, **kwargs) → FT

GOV.UK unordered list component. Use lists to make blocks of text easier to read, and to break information into manageable chunks.

Examples

>>> li = ds.Li("test")
>>> ul = ds.Ul(li)
>>> str(ul)
'<ul class="govuk-list"><li>test</li></ul>'
>>> ul = ds.Ul(li, bullet=True)
>>> str(ul)
'<ul class="govuk-list govuk-list--bullet"><li>test</li></ul>'
>>> ul = ds.Ul(li, numbered=True)
>>> str(ul)
'<ul class="govuk-list govuk-list--number"><li>test</li></ul>'
Parameters:

  • *args – Items to include in the list.

  • bullet (bool, optional) – If True, applies a bullet style. Defaults to False.

  • numbered (bool, optional) – If True, applies a numbered style. Defaults to False.

  • spaced (bool, optional) – If True, applies a spaced style. Defaults to False.

  • **kwargs – Additional attributes for the list.

Returns:

A FastHTML unordered list component.

Return type:

FT