The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
🎯 Spiritual Clarity | Dar-ul-Tajweed Learning UI
Introducing the Dar-ul-Tajweed Website Design | a calm, structured, and faith-centered digital interface crafted for Islamic educational platforms specializing in Quranic recitation. 📖✨
This project focuses on respectful accessibility. For a platform dedicated to spiritual learning, the UI must balance traditional values with modern usability. By utilizing a deep royal blue foundation with elegant gold accents and subtle geometric motifs, the design creates a serene environment that encourages focus and lifelong learning. 📈
Why this UI works:
🌙 Calm & Spiritual Palette: A sophisticated combination of deep blues and sunset gold that evokes a sense of peace, tradition, and academic excellence.
📋 Frictionless Trial Integration: A high-visibility "07 Days Trial Now!" lead generation form designed to lower the barrier for new students while emphasizing the platform’s value.
✨ Subtle Islamic Elements: Elegant use of traditional geometric patterns and golden dividers that reinforce the brand’s mission without cluttering the user interface.
📚 Focused Service Hierarchy: A clean, spacious hero section with a bold "Online Quran Courses" headline to immediately define the platform’s core offering for all ages.
🤝 Purpose-Driven CTAs: Strategic use of "Join Now" and "Claim 7 Days Free Trial" buttons that guide users toward enrollment with a clear, benefit-oriented flow.
📱 Structured UX Architecture: A mobile-ready, modular layout that ensures course information and contact details are easily accessible for students and parents alike.
This website design doesn't just display educational courses | it provides a dignified and modern digital roadmap that supports the preservation and teaching of proper Tajweed. 💰
🛠 Figma | UI Design | EdTech UI | Islamic Branding | Lead Generation | User Experience
📂 View full project: Behance Link
💬 Are you an educational institution or spiritual platform looking to bridge the gap between tradition and modern digital standards? Let’s design a space that inspires learning! 🚀
UI Design | UX Design | Figma
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Had so much fun working on this @framer Build ! Finally it's live!
Drix Entertainment needed a website that felt like the experiences they produce. The brief was simple: make it feel alive, not like a brochure.
Dark, cinematic, and built to move. Custom cursor, floating nav, card scroll animations, and a full CMS powering their Wings, blog, and careers. Three verticals, one cohesive site, zero compromise on interactions.
Built end to end in Framer. Check it out: drixentertainment.com
Nice!
The "assign subject to students" section. Which should i go for?
3 voted
50%
3 voted
50%
6 votes
Closed
I’m leaning toward B for this specific flow. Grid layouts reduce the cognitive load by showing the full scope of options at once, whereas the list in A adds an extra click/scroll layer that can slow down the user—even if it looks better. I've found that B works better for CRO.
Just wrapped up an AI agency website on Framer for a recent client project.
The goal was to create something clean, modern, and conversion-focusedwhile still keeping that “tech/AI” feel without making it overly complex.
I focused on:
• Clear structure and flow
• Strong visual hierarchy
• Responsive design across devices
• Subtle interactions to keep it engaging
I’d really appreciate some honest feedback from the community especially on:
– Overall design and layout
– User experience and flow
– Anything that could improve conversions
Always looking to refine and improve my work.
https://medcalla.com/
Thanks in advance 🙏
Framer Website DevelopmentFramer Website DesignFramerFigmafreelancerlifeFrameshipFramer Plugin Developerportfolioreviewcreativeaiflow
Great feedback for a job well done
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
portfolioreview
The best portfolios tell a story, not just show a grid. Share yours for feedback.
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?
