SGDS Page Templates

Ready-to-use full-page templates using SGDS components and utilities — adapted from the visual patterns of shadcn Blocks. Each template gives a beautiful starting point without writing layout code from scratch.

Prerequisites

Every page must include the Application Shell. Read sgds-pattern-block-templates → reference/application-shell.md before generating any page. The shell provides mandatory <sgds-masthead>, <sgds-mainnav>, and <sgds-footer> on every page, plus container class selection (.sgds-container vs .sgds-container-sidebar) and sticky-header conventions. Never generate a page template without all three shell components.

import "@govtechsg/sgds-web-component/themes/day.css";
import "@govtechsg/sgds-web-component/css/sgds.css";
import "@govtechsg/sgds-web-component/css/utility.css";

See sgds-getting-started and sgds-components for full installation.

For container width and max-width utilities used in these templates, see sgds-utilities.