ButtonsButtons in every style InputsText, search, number and more SelectsDropdown and multi-select CheckboxesCheckbox designs Radio ButtonsRadio group designs TogglesSwitch and toggle designs BadgesLabels and status chips AlertsInformational alerts TooltipsHover tooltips DropdownsMenu dropdowns ModalsDialogs and modals TabsTab navigation AccordionsExpandable sections BreadcrumbsBreadcrumb navigation PaginationPage pagination LoadersLoading indicators CardsCard components NavigationNavbars and menus FeedbackToasts, alerts, skeletons FormsComplete form layouts

Hero Features About Services Testimonials Pricing FAQ CTA Contact Newsletter Team Portfolio Footer Header

CSS GSAP Framer Motion Scroll Hover Text Cursor Parallax SVG Canvas Three.js WebGL Background

HTMLPlain HTML/CSS/JS CSSPure CSS modules JavaScriptVanilla JavaScript TypeScriptTyped TypeScript ReactReact component library Next.jsNext.js App Router AngularAngular modules VueVue 3 components SvelteSvelte components AstroAstro islands ShopifyShopify themes

Sections Components Product Cards Cart & Drawers Product Page Sliders & Carousels

Home
Components
Modals

Modals

Dialogs and modals

1 modules

Modal Dialog preview

Modal Dialog

An accessible modal with focus trap basics.

Get new modules in your inbox

One short email a week with the latest components, sections and animations.

Email address

ModuleHarbor is a growing library of production-ready UI components, website sections, animations, Shopify modules, frontend components, backend utilities and developer resources — ready to preview, customize, copy and use.

Built for developers, everywhere.

ModuleHarbor

About
Contact
Submit Module
GitHub

Explore

Components
Sections
Animations
Shopify
React
Angular
Vue

Resources

Documentation
API
Contribution
Changelog
Roadmap

Legal

Privacy
Terms
Licenses
DMCA

© 2026 ModuleHarbor. All rights reserved.

Crafted with by developers, for developers.

Command Palette

Search modules and jump anywhere