Style hub

glassmorphism components

48 published entries carry the glassmorphism label. They cost 62.2 KB gzipped on average against 54.1 KB across the index, which is 8.1 KB more per component. They record 0.6 axe findings per entry against 0.5 across the index, 0.1 more. 48 of them mount, 33 scan clean, and 7 survive the bare install with the shadcn-style helpers removed.

48Entries in this style

62.2Average gzip

0.6Average axe findings

7Pass bare install

Filter the 48 entries on this page

48 shown

This box narrows the cards already on the page. To search the whole index, open a style or pattern hub below.

1 to 48 of 48Page 1 of 1

cultui-edge-blur

Motion

Harness screenshot of cultui-edge-blur at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 20.8KB
Bare: pass
Prov: NO

glassmorphismbackground-effect

cultui-distorted-glass

Motion

Harness screenshot of cultui-distorted-glass at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 29.7KB
Bare: pass
Prov: NO

glassmorphismbackground-effect

efferd-pricing-2

Harness screenshot of efferd-pricing-2 at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 29.8KB
Bare: pass
Prov: NO

glassmorphismpricing

cultui-dynamic-island

Motion

Harness screenshot of cultui-dynamic-island at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 61.5KB
Bare: pass
Prov: NO

glassmorphismcard

ruixen-banner-cookie

Harness screenshot of ruixen-banner-cookie at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 27.5KB
Bare: fail
Prov: NO

glassmorphismcard

tripled-glassmorphism-testimonials-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-testimonials-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 27.8KB
Bare: fail
Prov: NO

glassmorphismtestimonials

tripled-feature-cards-block-shadcnui

Motion

Harness screenshot of tripled-feature-cards-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 27.9KB
Bare: fail
Prov: NO

glassmorphismfeature-grid

tripled-glassmorphism-cta-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-cta-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 29.4KB
Bare: fail
Prov: NO

glassmorphismcta

tripled-glassmorphism-hero-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-hero-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 30.4KB
Bare: fail
Prov: NO

glassmorphismhero-effect

tripled-glassmorphism-pricing-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-pricing-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 30.4KB
Bare: fail
Prov: NO

glassmorphismpricing

tripled-mac-searchbar-shadcnui

Motion

Harness screenshot of tripled-mac-searchbar-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 61.4KB
Bare: fail
Prov: NO

glassmorphisminput

tripled-multiple-accounts-shadcnui

Motion

Harness screenshot of tripled-multiple-accounts-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 62.0KB
Bare: fail
Prov: NO

glassmorphismswitch

tripled-glassmorphism-statistics-card-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-statistics-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 68.7KB
Bare: fail
Prov: NO

glassmorphismscroll-effect

cultui-side-panel

Motion

Harness screenshot of cultui-side-panel at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 69.6KB
Bare: fail
Prov: NO

glassmorphismsheet

tripled-glass-verification-code-card-shadcnui

Motion

Harness screenshot of tripled-glass-verification-code-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 70.2KB
Bare: fail
Prov: NO

glassmorphisminput

tripled-glass-forgot-password-card-shadcnui

Motion

Harness screenshot of tripled-glass-forgot-password-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 70.5KB
Bare: fail
Prov: NO

glassmorphismauth-form

cultui-floating-panel

Motion

Harness screenshot of cultui-floating-panel at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 70.7KB
Bare: fail
Prov: NO

glassmorphismcard

cultui-morph-surface

Motion

Harness screenshot of cultui-morph-surface at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 70.7KB
Bare: fail
Prov: NO

glassmorphismtransition-effect

tripled-project-card-shadcnui

Motion

Harness screenshot of tripled-project-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 70.7KB
Bare: fail
Prov: NO

glassmorphismbadge

tripled-glass-wallet-card-shadcnui

Motion

Harness screenshot of tripled-glass-wallet-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 71.0KB
Bare: fail
Prov: NO

glassmorphismhover-effect

tripled-glassmorphism-logo-showcase-block-shadcnui

Motion

Renders: YES
A11y: 0
Gzip: 71.0KB
Bare: fail
Prov: NO

glassmorphismcta

tripled-glass-order-summary-shadcnui

Motion

Harness screenshot of tripled-glass-order-summary-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 71.1KB
Bare: fail
Prov: NO

glassmorphismbutton

tripled-glassmorphism-minimal-metrics-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-minimal-metrics-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 72.0KB
Bare: fail
Prov: NO

glassmorphismcta

tripled-glassmorphism-product-update-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-product-update-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 72.3KB
Bare: fail
Prov: NO

glassmorphismbadge

tripled-bottom-modal

Motion

Harness screenshot of tripled-bottom-modal at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 72.5KB
Bare: fail
Prov: NO

glassmorphismdialog

tripled-glass-blog-card-shadcnui

Motion

Harness screenshot of tripled-glass-blog-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 72.9KB
Bare: fail
Prov: NO

glassmorphismauth-form

tripled-glassmorphism-portfolio-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-portfolio-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 73.2KB
Bare: fail
Prov: NO

glassmorphismhover-effect

tripled-glass-account-settings-card-shadcnui

Motion

Harness screenshot of tripled-glass-account-settings-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 75.1KB
Bare: fail
Prov: NO

glassmorphismpricing

tripled-glass-sign-in-card-shadcnui

Motion

Harness screenshot of tripled-glass-sign-in-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 76.0KB
Bare: fail
Prov: NO

glassmorphismauth-form

tripled-glass-sign-up-card-shadcnui

Motion

Harness screenshot of tripled-glass-sign-up-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 76.3KB
Bare: fail
Prov: NO

glassmorphismauth-form

tripled-glass-profile-settings-card-shadcnui

Motion

Renders: YES
A11y: 0
Gzip: 76.6KB
Bare: fail
Prov: NO

glassmorphismavatar

cultui-family-drawer

Motion

Harness screenshot of cultui-family-drawer at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 83.4KB
Bare: fail
Prov: NO

glassmorphismsheet

cultui-shader-lens-blur

Motion

Harness screenshot of cultui-shader-lens-blur at 768 pixels wide

Renders: YES
A11y: 0
Gzip: 188.8KB
Bare: fail
Prov: NO

glassmorphismbackground-effect

ruixen-notification

Motion

Harness screenshot of ruixen-notification at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 61.0KB
Bare: pass
Prov: NO

glassmorphismalert

ruixen-magnetic-tabs

Motion

Harness screenshot of ruixen-magnetic-tabs at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 61.6KB
Bare: pass
Prov: NO

glassmorphismselect

tripled-native-button-shadcnui

Motion

Harness screenshot of tripled-native-button-shadcnui at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 29.9KB
Bare: fail
Prov: NO

glassmorphismbutton

tripled-glassmorphism-listen-app-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-listen-app-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 33.7KB
Bare: fail
Prov: NO

glassmorphismhover-effect

tripled-glass-checkout-card-shadcnui

Motion

Harness screenshot of tripled-glass-checkout-card-shadcnui at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 71.2KB
Bare: fail
Prov: NO

glassmorphisminput

tripled-native-badge

Motion

Harness screenshot of tripled-native-badge at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 72.0KB
Bare: fail
Prov: NO

glassmorphismbadge

tripled-native-badge-carbon

Motion

Harness screenshot of tripled-native-badge-carbon at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 72.0KB
Bare: fail
Prov: NO

glassmorphismbadge

tripled-conference-ticket-shadcnui

Motion

Harness screenshot of tripled-conference-ticket-shadcnui at 768 pixels wide

Renders: YES
A11y: 1
Gzip: 73.9KB
Bare: fail
Prov: NO

glassmorphismchart

ruixen-notification-inbox-popover

Motion

Harness screenshot of ruixen-notification-inbox-popover at 768 pixels wide

Renders: YES
A11y: 2
Gzip: 62.1KB
Bare: pass
Prov: NO

glassmorphismalert

ruixen-profile-card

Motion

Renders: YES
A11y: 2
Gzip: 35.5KB
Bare: fail
Prov: NO

glassmorphismbutton

ruixen-pricing-tiers

Motion

Harness screenshot of ruixen-pricing-tiers at 768 pixels wide

Renders: YES
A11y: 2
Gzip: 52.4KB
Bare: fail
Prov: NO

glassmorphismpricing

tripled-glassmorphism-launch-timeline-block-shadcnui

Motion

Harness screenshot of tripled-glassmorphism-launch-timeline-block-shadcnui at 768 pixels wide

Renders: YES
A11y: 2
Gzip: 72.3KB
Bare: fail
Prov: NO

glassmorphismcta

tripled-about-us-page-shadcnui

Motion

Harness screenshot of tripled-about-us-page-shadcnui at 768 pixels wide

Renders: YES
A11y: 3
Gzip: 73.9KB
Bare: fail
Prov: NO

glassmorphismhover-effect

tripled-kanban-board-shadcnui

Motion

Harness screenshot of tripled-kanban-board-shadcnui at 768 pixels wide

Renders: YES
A11y: 4
Gzip: 52.7KB
Bare: fail
Prov: NO

glassmorphismfeature-grid

tripled-messenger-shadcnui

Motion

Harness screenshot of tripled-messenger-shadcnui at 768 pixels wide

Renders: YES
A11y: 5
Gzip: 79.6KB
Bare: fail
Prov: NO

glassmorphismform