Theme test

This page is here so you can quickly check typography, buttons, cards, alerts, forms and tables against the current theme. Adjust src/styles/global.css and refresh.

Headings & text

H1 heading

H2 heading

H3 heading

This is a standard paragraph of body copy. Strong text, emphasis and a simple link all use the same core palette.

Buttons

Lists

  • Simple bullet item
  • Another bullet point
  • Something slightly longer to wrap
  1. Step one
  2. Step two
  3. Step three

Alerts

Example alert

Use this pattern to highlight important information or warnings for the user.

Subtle note

A quieter version you can reuse for secondary notices or tips.

Form controls

Table & code

FeatureStatusNotes
LayoutReadyHeader, footer and main wrapper in place.
ThemeSlate 50–500Adjust tokens in global.css.
ContentPlaceholderSwap for real copy per client.
/* Example: override --color-accent in src/styles/global.css */
        

Happy with the theme?

Once the base look feels right, clone this starter for your next client, swap colours and content, and deploy.

Back to home