NexoreUI
InstallationComponentsNexore MakeGitHub
GitHub
NexoreUIv0.1.2

Getting Started

Installation

Components

ButtonInputCardBadgeAlertAvatarAccordionModal / DialogTooltipTabsProgressSkeletonSliderSwitchRatingCommandTableStepperScroll AreaFile UploadNavigationIconsDock

Pro

ChartsData DisplayDark Mode ToolkitCommerceCookie ConsentSocialPremium EffectsLoaders

Animated

MarqueeNumber TickerAnimated NumberTyping AnimationBlur FadeBox RevealFile Preview CardImage Compare
MIT License
DocsCookie Consent

Cookie Consent

Cookie consent banners and privacy notices.

Next ComponentSocial

Cookie Management

Cookie banners, settings, and toasts for privacy compliance.

When to use

standard bannerFulfilling GDPR and CCPA tracking banner rules upon initial site visits
minimal bannerCompact footers or subpages requesting user tracking permission with minimal noise
cookie settingsProviding users granular checkbox categories to toggle optional analytics or marketing cookies
cookie toastSimple privacy notices notifying that cookies are used, requiring basic acknowledgment

Standard Banner (Bottom)

We value your privacy

We use cookies to enhance your browsing experience, serve personalized ads or content, and analyze our traffic.

component.tsx

Minimal Banner

We value your privacy

We use cookies to enhance your browsing experience, serve personalized ads or content, and analyze our traffic.

component.tsx

Top Banner

We value your privacy

We use cookies to enhance your browsing experience, serve personalized ads or content, and analyze our traffic.

component.tsx

Cookie Settings Modal

Cookie Preferences

Essential Cookies

Required for the website to function.

Analytics Cookies

Help us improve our website.

Marketing Cookies

Used for targeted advertising.

component.tsx

Cookie Toast Notification

🍪 We use cookies!
component.tsx
Page 1 of 2

CookieBanner Props

API Reference (Props)

PropTypeDefaultDescription
onAccept*() => void—Fired when user accepts all tracking policies.
onDecline() => void—Fired when user declines policy.
onSettings() => void—Fired when user triggers custom settings preference dial.
position"top" | "bottom""bottom"Controls layout placement on viewport.
variant"default" | "minimal""default"The preset layout style constraint.

CookieSettings Props

API Reference (Props)

PropTypeDefaultDescription
onAccept*() => void—Fired when user accepts customized tracking categories.
onDecline*() => void—Fired when user rejects optional analytics cookies.

♿ Accessibility (a11y)

  • Keyboard Trap: Custom Cookie settings dialogs should implement modal keyboard traps to ensure blind users can configure preferences before continuing site navigation.
  • Semantic Banner: Wrap page banner components using role="region" and label with aria-label="Cookie consent banner".