MedsZap | Medical Condition Categories Update
A clean, modern medical and health-tech design system featuring a high-trust turquoise primary color (#1ABC9C), geometric sans-serif typography (Satoshi), and an emoji-centric categorical navigation. Suitable for pharmacy delivery, health diagnostics, wellness platforms, and telemedicine services. The layout utilizes a minimalist 'Zomato-style' aesthetic with sticky navigation, horizontal scrolling carousels, and high-quality photography cards with distinct status badges. Key attributes include pastel-tinted circular iconography, smooth cubic-bezier transitions, and a dense, functional grid structure.
Summary
A professional yet approachable medical e-commerce interface using the 'Satoshi' font, a vibrant turquoise primary accent (#1ABC9C), and a clean white-space heavy layout. The design focuses on ease of navigation through colorful emoji-based category badges and high-resolution pharmacy cards featuring quick-glance data like ratings, distance, and delivery time.
Style
The style is defined by its clean, medical-grade minimalism paired with friendly, colorful accents. Typography uses Satoshi for a modern, geometric feel. The primary color is #1ABC9C (Turquoise), used for logos and primary CTAs. Success states and ratings use #24963F (Green). Animation is subtle, utilizing a custom cubic-bezier(0.4, 0, 0.2, 1) for 300ms transitions on hover states. The use of emoji-based circular icons on pastel backgrounds (e.g., blue-100, pink-100) creates an intuitive visual taxonomy.
Layout & Structure
The layout is a single-page scrolling experience with a fixed top navigation. It follows a modular block structure: Global Search -> Breadcrumbs -> Category Carousel -> Brand Grid -> Filter Bar -> Main Product/Pharmacy Grid -> Multi-column Footer.
Sticky Header
Health Category Carousel
Brand Partner Grid
Pharmacy Delivery Grid
Footer
Components
Condition Category Badge
A circular icon representing medical categories using emojis and pastel backgrounds.
Rating Pill
Compact success-colored badge for displaying user ratings.