Foodly – Restaurant and Food Delivery UI Kit for Ionic

Best Offer For a Limited Time

Foodly — Food Delivery App UI Kit for Ionic

Foodly is a clean, modern Ionic UI kit built for food ordering and delivery apps. It includes professionally designed, fully navigable screens covering onboarding, authentication, restaurant browsing, ordering, and account management — a solid, well-organized starting point for developers who want to save time on UI work and focus on their own backend and business logic.

⚠ Please read before purchasing — Scope of this item

Foodly is a front-end UI Kit only. It does not include a backend, database, payment gateway, or live order-tracking server. All screens use static/sample data (restaurants, menu items, orders, addresses). You (or your developer) will need to connect your own backend and payment provider to make ordering, payments, and tracking functional end to end. Please keep this in mind before purchasing — it will save you support tickets and help you decide if this item fits your project.

Key Features

• Built with Ionic 9 + Angular 22 + Capacitor 8
• Intro / onboarding screen
• Login, Signup, Email, Phone & OTP verification, Forgot Password
• Address & location selection screens
• Home feed with featured restaurants & products
• Restaurant detail, menu, and filter screens
• Search with category browsing (e.g. Burgers)
• Order list & order detail screens
• Active order & payment screens
• Account: profile settings, change password, saved addresses, payment methods, referral, QR scan, browsing history
• Bottom tab navigation — Home, Search, Order, Account
• Clean, feature-based folder structure, easy to re-theme

Image Preview

Screens Included

<tbody> </tbody>

Screen	Description
Intro	Onboarding / welcome screen
Login / Signup	Authentication screens (Email, Phone, OTP, Forgot Password)
Address / Location	Delivery address & location selection
Home	Featured restaurants & food items
Restaurant / Filter	Restaurant detail & menu filtering
Search	Search with category browsing
Order List / Detail	Past & active orders
Payment	Payment method selection (UI only)
Account	Profile, password, saved addresses, referral, QR scan

What’s NOT Included

• No backend / server / database of any kind
• No payment gateway integration (Stripe, Razorpay, etc.)
• No real-time order tracking or delivery-partner logic
• No working social login (buttons are UI only — not functional authentication)
• No push notifications

Requirements

• Node.js 18+ and npm
• Ionic CLI (npm install -g @ionic/cli)
• Android Studio (for Android builds)
• Xcode + CocoaPods for iOS builds (macOS only)
• Basic familiarity with Ionic/Angular to integrate your own backend

Third-Party Packages Used

All dependencies are open-source packages available on npm:

• Ionic Framework & Angular — core app framework
• Capacitor — native Android/iOS runtime
• Ionicons — icon set
• Swiper — sliders/carousels
• ng-otp-input — OTP input UI

Assets & Credits

The food, restaurant, and profile images bundled with this kit are placeholder/demo images provided only to preview the UI layout. Please replace them with your own properly licensed images before publishing or distributing your final app.

Customization

• Colors & Typography: edit src/theme/variables.scss and each page’s own .scss file
• Static Data: edit the data arrays inside each *.page.ts file (restaurants, menu items, orders)
• App Icon & Splash: replace resources/icon.png and resources/splash.png, then regenerate
• Bundle / Application ID: update in capacitor.config.ts, config.xml, and the native project files before publishing

Documentation

Full setup and customization documentation is included with your download, covering installation, project structure, screen reference, and backend-integration guidance.

Test It Now

We Have a Flutter Version Available

We Have a React Native Version Available

Version 1.0 (11-09-2026)

- Initial release
- Ionic Version 9.0.2
- @ionic/angular Used

Support

For questions, customization requests, or issues, please use this item’s support tab/comments here on CodeCanyon. We aim to respond to all queries as quickly as possible.

Thank you for checking out Foodly!