Snippet Gallery
Discover and share Flutter UI components built with Wind. Browse community snippets, fork and customize them.
All Snippets
Browse 68 community snippets
Flutter Workout Plan Card with Exercise List
A compact fitness workout card: session title with a gradient icon badge, difficulty and calorie chips, a numbered exercise list with set and rep counts, and a bold start button. Built in the Wind Dart dialect with Tailwind-style className and full dark-mode pairs.
Flutter Checkout Order Summary Card
An e-commerce checkout summary with product line items, a totals breakdown, a discount code badge, and a secure Place Order button. Styled entirely with Wind UI utility classes and dark mode ready.
Flutter Podcast Now Playing Card with Controls
A media now-playing card with cover art, episode title, a progress track with elapsed and total time, and playback controls. Styled entirely with Wind UI utility classes and dark mode ready.
Flutter Social Post Card with Engagement Actions
A social feed post card with a verified author header, body copy, a media banner, and like, comment, share, and bookmark actions. Styled entirely with Wind UI utility classes and dark mode ready.
Flutter Transaction Activity List for Fintech Apps
A fintech activity feed listing recent transactions with category icons, merchant labels, and color-coded signed amounts. Styled entirely with Wind UI utility classes and dark mode ready.
Flutter Dashboard Stat Cards with Trend Badges
Three dashboard metric cards showing a value, label, and up or down trend badge with icons. A compact KPI row built with Wind UI utility classes and dark mode.
Flutter Success Toast Notification
A floating success toast with an icon, a title, a message, and an action link. An ephemeral feedback pattern built with Wind UI className utilities and dark mode.
Flutter Testimonial Card with Star Rating
A customer testimonial card with a five-star rating, a quote, an initials avatar, and the author name and role. Built with Wind UI className utilities, dark mode ready.
Flutter Profile Card UI: Avatar, Stats, and Actions
A social profile card with a gradient cover, initials avatar, follower stats, and Follow plus Message actions. Built with Wind UI className utilities and dark mode pairs.
Flutter Settings List with Icon Rows
A settings list with leading icon tiles, titles, subtitles, and trailing chevrons. A preferences screen pattern built with Wind UI utility classes and dark mode.
Flutter Rating Summary with Score and Bars
A review summary with a large average score, a star row, total count, and rating distribution bars. Built with Wind UI className utilities, dark mode included.
Flutter Pricing Card with Tailwind-Style className
A SaaS pricing card built with Wind UI utility classes: icon badge, plan name, monthly price, a checkmark feature list, and a full-width CTA. Dark mode included.
Flutter Product Card for E-commerce Grids
An e-commerce product card with a discount badge, name, price, star rating, and an add-to-cart button. Styled entirely with Wind UI utility classes and dark mode ready.
Flutter Hero Section with Gradient and CTA Buttons
A landing-page hero with a gradient background, a highlight badge, a bold headline, supporting copy, and primary plus secondary CTA buttons. Built with Wind UI.
Flutter Feature Grid: Three-Column Highlights
A three-column feature grid with icon tiles, titles, and short descriptions. A marketing section built with Wind UI utility classes and full dark mode support.
Flutter Empty State with Icon and Call to Action
An empty-state panel with a muted icon, a headline, a short explanation, and a call-to-action button. A friendly no-data screen built with Wind UI utilities.
Flutter Bottom Navigation Bar UI
A bottom navigation bar with five destinations and an active highlighted tab. A mobile navigation pattern built with Wind UI utility classes, dark mode ready.
Flutter Filter Chips Row with Selected State
A wrapping row of filter chips with a selected state, built with Wind UI utility classes. A category and tag selector pattern with full dark mode support.
Flutter Avatar Group with Status and Count Badges
An avatar group showing online status dots and a remaining-count badge. A chat and presence pattern built with Wind UI utility classes and dark mode pairs.
Flutter Alert Banners: Success, Info, and Warning
Success, info, and warning alert banners with semantic colors, icons, and a close affordance. A reusable notification pattern built with Wind UI className utilities.