CookieConsent
GDPR-compliant cookie consent banner with preference management, category toggles, and persistent user choice storage
CookieConsent Component
Consent banner patterns for privacy-compliant UX across web applications.
Basic Usage
Default consent banner experience.
Implementation Notes
Keep setup minimal so teams can adopt the component quickly.
- • Use defaults first before introducing variants.
- • Keep labels and helper text explicit.
- • Verify accessibility behavior early.
Normal Usage
Customize text and placement for product requirements.
Implementation Notes
This pattern maps to everyday product screens and forms.
- • Use consistent variant and size tokens.
- • Pair with helper text for clarity.
- • Prefer predictable controlled behavior.
Advanced Usage
Wire acceptance/rejection callbacks for persistence and analytics.
Implementation Notes
Advanced mode should compose cleanly with app state and callbacks.
- • Wire callbacks for analytics and persistence.
- • Tune layout for dense, data-heavy views.
- • Document edge-case behavior in examples.
Real-Life Use Cases
Production use in public-facing pages with explicit policy links.
Implementation Notes
Show how the component fits real workflows, not isolated UI demos.
- • Model practical business scenarios.
- • Include realistic content and labels.
- • Highlight production-friendly defaults.
Related Components
View allCommand palette (⌘K) with fuzzy search, grouped commands, keyboard shortcuts, and recent history
Right-click context menu with nested menus, checkboxes, radio items, and keyboard shortcuts display
Modal dialog with focus trap, backdrop click handling, scroll locking, and nested dialog support
Side panel with directional sliding, scroll locking, and responsive mobile-first design