Component Examples
Real-world examples and patterns for common UI scenarios using Noor UI components.
Education Portal
Multi-page school portal with student dashboard, Saudi grading system, weekly timetable (Sun-Thu), assignment tracking, attendance calendar, and teacher directory. Authentic Saudi education experience.
Healthcare Clinic
Multi-page clinic management system with patient directory, medical records, appointment calendar with Hijri dates, and prescription management.
Islamic Finance Dashboard
Comprehensive Islamic finance management with Zakat calculator, investment tracking, Hijri calendar, prayer times, and transaction history.
Multi-Step Registration Form
A comprehensive 4-step registration form with validation, bilingual error messages, and perfect RTL support.
Calendar & Date Picker
Calendar interface with Hijri calendar support for GCC markets.
Real Estate Dashboard
Property listings platform with bilingual descriptions, search filters, and property cards with mock data.
Portfolio Site
Creative professional portfolio with project showcase, case studies, and contact forms. Perfect for designers and developers.
Marketplace
Multi-vendor marketplace with product listings, seller dashboards, and order management. Full e-commerce solution.
Advanced AI Playground
Full-featured AI playground with model selection, parameter controls, token tracking, conversation history, and settings panel.
Government Services Portal
Multi-page government services portal with digital ID login, multi-step service applications, document vault, and application tracking with Timeline.
Hotel Booking Platform
Full hotel booking experience with login, search with filters, property galleries with Carousel, multi-step booking flow with Stepper, reservations management, and user profile.
Banking & Personal Finance
Complete digital banking experience with account dashboard, Charts (donut, line, bar), transaction history with DataTable, money transfers with OTP verification, bill payments, and card management with Switch and Slider controls.
More Examples Coming Soon
We're working on adding more real-world examples including dashboards, e-commerce stores, and more. Check back soon for updates!
Looking for Email Templates?
Browse 13 production-ready MJML email templates with LTR, RTL, and bilingual variants — themed with Noor UI colors.
View Email Templates →Looking for Individual Components?
Browse our complete component library with 74 fully documented components with live examples and accessibility guidelines.
View All Components →