Skip to content
← Back to blog

Why We Built Open Pravatar as a Figma Plugin (Not Just Another Avatar API)

From ChatGPT Image 2 generation to in-canvas search: what we learned shipping a design-tool plugin

Placeholder people are everywhere in product design. User lists, CRM rows, onboarding screens, team settings, marketing hero sections — almost every interface needs faces before real photography exists.

The usual options are not great:

  • Stock sites — licensing friction, repetitive faces, and hours lost hunting for “professional woman, glasses, Singapore, fintech vibe”
  • Random avatar generators — fast, but visually inconsistent and hard to art-direct across a whole product
  • Custom photo shoots — expensive and slow for early-stage mockups

We built Open Pravatar to solve a narrower problem: realistic, art-directed placeholder portraits that teams can find by intent, not by luck — and use commercially without negotiating rights.

The web app and API came first. The Figma plugin came second. That order matters, and it explains where the value actually lives.

Start with the asset problem, not the plugin

The hard part was never rendering circles in a Figma frame. It was building a catalog worth searching.

Each portrait in Open Pravatar is generated with ChatGPT Image 2, then catalogued with structured metadata: geography, preset, mood, accessories, use case, and more. That metadata is what makes queries like “glasses in Japan” or “fintech Singapore” return coherent results instead of random noise.

We organised assets around visual presets — editorial-dark, SaaS-clean, fintech-light — so product teams can keep a consistent art direction across dozens of screens. A dashboard, a marketing page, and a settings panel can all pull from the same visual language.

Once the catalog existed, the delivery layer was straightforward:

  • Search and filter via REST API
  • Deterministic pick endpoints for stable placeholders
  • CDN-cacheable image URLs and thumbnail resizing
  • Curated ZIP packs for designers who do not want to integrate an API

At that point we had a useful library. We did not yet have a useful workflow.

The workflow gap: designers live in Figma

Here is what we kept seeing in practice.

A designer mockups a product screen in Figma. They need three plausible profile photos. They open a browser tab, search a library, download PNGs, drag them into Figma, resize, rename layers, and repeat.

Five minutes per screen. Multiplied across a sprint, that is a surprising amount of context switching for something that should be trivial.

The API was correct. The insertion point was wrong.

Design tools are not just viewers for assets. They are where composition happens. The value of a placeholder library is not “can I find an image?” It is “can I place the right image, at the right size, in the right layer, without leaving the file I am already in?”

That is why we shipped a Figma plugin.

What the plugin actually does

The Open Pravatar Figma plugin wraps the same search backend as the website:

  1. Select a frame or shape in your file
  2. Search by natural language or filters
  3. Insert a portrait directly into the selection

No download step. No tab switching. No guessing whether an image is licensed for commercial mockups.

Under the hood it is the same asset manifests, delivery URLs, and metadata model — just surfaced where the work happens.

Why this is more valuable than “another avatar API”

A lot of avatar tools optimise for volume: generate anything, fast, everywhere. Open Pravatar optimises for intent and placement:

ConcernTypical random avatar toolOpen Pravatar in Figma
Art directionInconsistent styles across screensPreset-driven visual coherence
DiscoveryScroll or regenerate until luckySearch by geography, mood, use case
LicensingOften unclear for client workFree commercial-use packs and API
WorkflowBrowser → download → importSearch and insert in-canvas
Production pathDemo-onlySame assets power live UIs via API

For agencies and product teams, the plugin is not a novelty. It removes a recurring micro-friction that compounds across every sprint review, every client presentation, and every handoff.

The API still matters — it is how sites and apps pull the same portraits programmatically. But for the design phase, meeting designers in Figma is the product.

How we approached the build

We treated it as two products sharing one catalog:

1. Generation and cataloguing

Portraits are created with ChatGPT Image 2 against deliberate briefs — not one-off prompts, but repeatable preset definitions. Each asset gets a JSON manifest describing what is in the image and how it should be retrieved.

2. Search and delivery

Cloudflare Workers serve fast, cacheable endpoints. Search ranks against structured fields, not just filenames. Thumbnail URLs accept width parameters so UIs and plugins do not ship full-size PNGs unnecessarily.

3. Figma plugin as a thin client

The plugin does not duplicate business logic. It calls the same search API, returns ranked results, and applies images to the user’s selection. Thin clients are easier to maintain and keep web, API, and Figma experiences aligned.

That separation — heavy catalog, light surfaces — is the pattern we would use again.

What we would tell another team considering a Figma plugin

If you already have a useful API or content library, a Figma plugin is often the highest-leverage surface you have not shipped yet.

A few lessons from Open Pravatar:

  • Build the catalog first. Plugins are only as good as the assets and metadata behind them.
  • Optimise for insertion, not browsing. Designers want the right image in the selected layer, not another gallery to scroll.
  • Keep one source of truth. The website, API, and plugin should read the same manifests.
  • Name the licensing clearly. “Free for commercial mockups” removes a question that otherwise blocks adoption.

The plugin is not a replacement for the API. It is the fastest path to value for the people who decide whether a product looks credible before a line of production code ships.

Try it

We build small, sharp tools that fit real workflows — Figma plugins, APIs, and static products that ship fast and stay maintainable.

If you are exploring a design-tool plugin or a searchable asset library for your team, we can help you scope what is worth building first.