Card - No Button

This variant is used for high-impact featured content that does not require an immediate call-to-action button. It relies on its strong visual presence to provide information or act as a featured highlight.

Grants &
funding

We distribute funding to community clubs, volunteers, and athletes. Our grants team can support you with information.

Athletes

When to use this component

Use the Card - No Button variant when you want to showcase featured information without forcing a specific user journey through a button. This is effective for:

  • Highlighting brand messages or mission statements
  • Showcasing imagery alongside descriptive text in a "Featured" section
  • Providing information that doesn't lead to a secondary page

How it works

This design uses a layered "Z-stack" where the content is separated into distinct visual planes:

  • The Base Layer: A solid Teal (#299D91) rectangle with sharp, non-rounded corners.
  • The Overlay Layer: An image container with a custom clip-path that sits on top (z-index 10).
  • Typography: Headlines are stacked and uppercase using Objektiv MK1 to create a bold, modern brand feel.
  • Spacing: Wide padding (p-12) ensures that the text does not touch the slanted edge of the image.

Sport Wales Guidelines

  • No Border Radius: This component is an exception to the 8px rule—use sharp corners.
  • Color: Use the Sport Wales Teal (#299D91) for informational featured cards.
  • Heading Style: Always use sentence case for standard text but Uppercase for these featured headlines.
  • Image Content: Ensure the focal point of the image is on the right side so it isn't cut off by the slant.