Test Page

Testing Hugo + Tailwind CSS setup with brand identity

November 2, 2024

Typography Test

This is a test page to verify our Hugo + Tailwind CSS setup is working correctly with The Circle Group brand identity.

Heading Level 3

Regular paragraph text using Inter Tight font family with default black-500 color. This should be easily readable and properly styled according to our brand guidelines.

Bold text and italic text should work correctly.

Lists

Unordered list:

  • Brand colors are configured (sierra, charcoal, stone, pepper, black)
  • Typography uses Plus Jakarta Sans for headings
  • Body text uses Inter Tight font family
  • Tailwind CSS v3.4 with PostCSS processing

Ordered list:

  1. Initialize Hugo project structure
  2. Configure Tailwind with brand identity
  3. Create base templates and layouts
  4. Add content and test pages
  5. Verify everything works correctly

Text Sizes

This paragraph demonstrates our body text sizing system. We have multiple size options available:

  • Body XL (18px) for prominent text
  • Body LG (16px) for standard body text
  • Body MD (14px) for supporting text
  • Body SM (12px) for captions and labels

Each size comes in three weights: regular (400), medium (500), and semibold (600).