FlutterShop - Premium E-commerce UI kit for Flutter

Chrome or Brave browser recommended for preview

FlutterShop is a premium E-commerce UI kit that you can use to build various e-commerce apps using Flutter that works on both Android & iOS.

This kit contains 100+ nicely crafted minimal screens that cover everything you need for your shop app.

Well organized project

8-Point grid spacing

The spaces on all screens of the FlutterShop UI Kit are implemented based on an 8-pixel grid system. This grid system helps to align page elements based on columns and rows. In this kit, we have two types of grids: hard and soft 8-grids.

FlutterShop premium e-commerce UI kit is recommended for developers, managers, and owners. No need you worry about the frontend FlutterShop covers everything for you, just need to connect it with the backend. Also recommended for those who want to redesign their shop app or shift to flutter with premium design. All of the screens support both light & dark themes.

Loading is no longer boring [New update V1.1] Doc

The progress indicator that comes with Flutter, by default is okay in most places, but not in every place. This is why we have created a custom loading effect that boosts user engagement even during the loading process. This kind of loading is common in popular apps like YouTube and LinkedIn.

Screens

As mentioned this kit contains 100+ nicely crafted minimal screens that cover everything you need!👇

Onboarding

• Onboarding Choose item
• Onboarding Add to card
• Onboarding Pay online
• Onboarding Track order
• Onboarding Find store
• Notificaiton permission
• Select language

Authentication

• Log in
• Forgot password
• Forgot password -> Choose verification method
• Forgot password -> Verification code
• Set new password
• Done reset password
• Sign up
• Sign up -> Setup profile
• Sign up -> Verification code
• Successfully sign up
• Terms and conditions
• Enable fingerprint
• Enable face ID

Product

• Product page
• Product page -> Notify when available (Out of stock)
• Product page -> Buy Now
• Product page -> Product details
• Product page -> Product reviews
• Product page -> Add review
• Product page -> Shipping methods
• Product page -> Product return policy
• Product page -> Product size guide
• Product page -> Store Pickup Availability
• Product page -> Added to cart message
• Product page -> Product gallery (Will be added soon)

Main page

• Home page
• On sales page
• Kids product page
• Brand page
• Discover Page (Categories) [Style 1]
• Discover Page (Categories) [Style 2] (Will be added soon)
• Discover Page (Categories) [Style 3] (Will be added soon)
• Bookmark products page

Search

• Search -> Recent search (Search history)
• Search -> Search suggestions
• Search filters
• Search filters -> Size filter
• Search filters -> Color filter
• Search filters -> Brand filter
• Search filters -> Price filter
• Search filters -> Sort by
• Search results
• Search result -> Product not found

Cart

• Products on Cart
• Empty cart
• Cart -> Choose address
• Cart -> Review & payment
• Cart -> Checkout / Payment method -> Select card
• Cart -> Checkout / Payment method -> Pay with cash
• Cart -> Checkout / Payment method -> Use credit
• Thanks for order
• Add new card
• Scan card (Will be added soon)

Profile

• Account -> Normal version
• Account -> Prp version
• Account -> Profile
• Account -> Profile -> Edit profile
• Account -> Notifications
• Account-> Empty notification
• Account -> Enable notification
• Account-> Notification -> Notification options
• Account -> Select Language
• Account -> Addresses
• Account -> Empty address
• Account -> Address -> Add new address
• Account -> Add number
• Account -> Add number -> Verification code
• Account -> Selected location
• Account -> Payment -> Cards
• Account -> Empty payment
• Empty Wallet
• Wallet
• Wallet history
• Account -> Help & Chat (Support)
• Account -> Help & Chat -> Chat
• Account -> Preferences

Order

• Account -> Orders
• Orders -> Processing orders
• Orders -> Processing order -> Cancle order
• Orders -> Cancaled orders
• Orders -> Delivered orders
• Orders -> Return orders (Will be added soon)
• more screen added on that sector soon

Return & Request (Will be added soon)

• Return order list
• Empty return order
• Return order
• Return detail

Error & permission

• Notificaiton permission
• No notification
• Select language
• No internet
• Server error
• Location permissions
• No search result
• Empty order list
• No Address found
• Empty payment
• Empty wallet

and MORE!!!! 🤩

Change logs

FlutterShop V2.1 - 3 July 2024

• Icon issue fixed
• Most of SVG icon color replaced with colorFilter
• Upgrade to Flutter V3.22
• Updated all packages to the latest versions
• Add more screens on the free version
• Free version full code updated now no error
• Live preview updated
• 27+ small & big bug fixes

FlutterShop V2.0 - 20 Mar 2023

• Documentation added
• Fixed button icon color issue
• Bottom Model Sheet improved for better user experience
• Added TextButtonTheme
• Created AppTheme for easy theme management.
• Updated to Flutter V3.19
• Updated all packages to the latest versions
• 46+ small & big bugs fixed

FlutterShop V1.2 - 1 Feb 2023

• Upgrade to the latest Flutter version 3.7.+
• UI updated with the latest TextTheme
• Resolved the color problem with TextButton, ProductCard, and AddressCard
• Bug fixes

FlutterShop V1.1 - 20 Nov 2022

• Custom loading added
• Bug fixes