Banner

Banner component with multiple display variants for highlighting important information.

Usage Guidelines

The banner component should only be used on landing pages etc. as a prominent way to display a core message. Use the appropriate variant based on the content structure and emphasis needed.

Variants

• Accent Only
• With Prefix
• With Suffix
• Full

The banner is structured as follows: The first line is an optional prefix, the second line - which is of larger font size - is the main message, and the third line is an optional suffix.

Accessibility Notes

• Semantic HTML structure ensures proper screen reader navigation
• High contrast colors meet WCAG AA standards
• Text is properly structured for assistive technologies

Implementation Status

✅ Fully functional - complete implementation with all variants

Design Notes

None