Refero

What is Refero?

Refero is a design research platform offering a curated collection of 100,000+ real-world web and iOS product screens, organized by page types, UX patterns, UI elements, user flows, and fonts. Unlike inspiration galleries that showcase conceptual work, Refero exclusively features screens from live, shipped products — making it a practical reference tool rather than a mood board. It serves UX/UI designers, product managers, and AI agents that need grounded, real-world interface data to inform design decisions.

Key Features

• Massive Real-Product Screen Library

  100,000+ curated screenshots sourced exclusively from live web and iOS products, organized by page type, industry, and UI component — updated weekly with fresh content.

• UX Flows

  End-to-end user journey maps covering sign-up, onboarding, checkout, and account management flows, allowing designers to study full interaction sequences rather than isolated screens.

• Granular Search & Filtering

  Search by page type, UX pattern, UI element, company, industry, or plain language — with filters for platform (web or iOS) to surface exactly what you need.

• UX Patterns & UI Elements

  87+ UX patterns and 69+ UI elements — from testimonial carousels and billing flows to skeleton loaders and navigation bars — tagged with technical metadata for precise reference.

• Font Reference Library

  Catalogs thousands of font implementations from real products, including usage statistics, pairing recommendations, and responsive design applications.

• Figma Plugin & MCP Server

  Insert real product references directly inside Figma, or connect AI agents via MCP so they can research actual shipped interfaces before generating design output.

Use Cases

• UX/UI Design Research : Designers benchmark their work against real shipped products — finding how top companies handle dashboards, paywalls, or onboarding — without manually hunting across dozens of apps.
• Competitive & Pattern Analysis : Product managers and designers can audit how industry peers structure specific flows or implement recurring UI patterns, backed by actual product evidence.
• AI-Assisted Design Workflows : AI agents connect via MCP to ground their output in real product interfaces, reducing hallucinated or generic design suggestions during code or prototype generation.
• Typography & Visual Consistency : Teams exploring font choices can reference how popular products implement specific typefaces across devices, supporting more informed and consistent design systems.
• Rapid Prototyping Reference : Designers working in Figma can pull real product screens directly into their workspace as references, accelerating wireframing and reducing guesswork.

FAQs