Required for .gov.sg services
All government digital services are required to include a footer with service name, contact information, privacy statement, and terms of use.
Footer
The footer contains supporting information for your service at the bottom of your website.
GitHub
components/footer
components/footerStorybook
components/footer
components/footerPersistent across pages
The footer provides a consistent anchor at the bottom of every page — users know where to find legal and contact information regardless of where they are.
Supports trust and compliance
A standardised footer reinforces the official identity of a government service and helps users verify they're on an authentic .gov.sg site.
1
Container
2
Title (slot)
3
Description (slot)
4
Items (slot)
Default
The footer contains mandatory service information — name, contact links, and legal information — required on all .gov.sg pages.
Renders the required government footer with service name, contact links, and legal information. Use on every page of a .gov.sg service to meet mandatory disclosure requirements.
Component tokens
Component tokens are specific to each component. Use the table title as the prefix: padding-2-xl under sgds/footer means sgds/footer/padding-2-xl.
sgds/footer
sgds/padding/2-xlsgds/padding/3-xlsgds/padding/lgsgds/padding/nonesgds/padding/xlsgds/gap/2-xlsgds/gap/3-xlsgds/gap/lgsgds/gap/mdsgds/gap/smsgds/gap/xlsgds/gap/xssgds/border-color-defaultsgds/border-width/1sgds/font-size/14sgds/font-size/24sgds/font-size/28sgds/font-weight/regularWhen to use
- Use footer for persistent supporting links and organisational information at the end of the page.
- Use it for secondary actions and reference content, not primary task content.
When not to use
- Do not move important task actions or critical page guidance into the footer.
- Do not overload the footer with too many competing link groups.
Keep footer content secondary
Supporting links and organisational details belong in the footer because they do not interrupt the main task.
Do not hide primary content in the footer
If users need the content to finish the task, it should not be buried at the end of the page.
Built-in accessibility
- Footers provide structured areas for site links and supporting information.
- Footer links keep native link behaviour.
Labels and content
- Use link text that matches the destination.
- Group related footer links under clear headings.
Focus and interaction
- Users should be able to tab through footer links in a predictable order.
- Avoid adding non-link text that looks like a link.
TabShift+TabEnterHave suggestions or feedback?
Share them with us on
Found a bug or issue?
Report it on GitHub
Singapore Government Design System
The Singapore Government Design System was developed to empower teams in creating fast, accessible and mobile-friendly digital services.