ProtoFluid

ProtoFluid is in early-access!

There are a few known issues, the docs need work, but let's go! 🥳

Welcome

ProtoFluid delivers an in-document responsive design testing app that manages flexible <iframe> viewports, pop-up windows and more.

Viewport meta mimicry expands testing on phones and reduces device lab costs dramatically.

Gold sponsors

Become a sponsor — or perhaps — a hero?

Try it now — for free!

Take ProtoFluid for a spin on this website or download ProtoFluid and trial it on yours.

Download

Version: 0.0.9 | 12.8.2026

ProtoFluid Pro + Add-ons

ProtoFluid Pro offers unlimited viewports, fullscreen mode and wake lock.

Further add-ons will be arriving shortly, the first being ‘Presentation mode’.

Visit the shop

Effortless testing

ProtoFluid highlights neat responsive work that would otherwise be missed.
  • Extend your responsive visibility with parallel viewports.
  • Reduce cognitive overhead and preview style changes across breakpoints.
  • Spot issues early and avoid rework at the end of a project.

Feature highlights

  • Includes viewports for watches, phones, tablets and beyond.
  • Viewport <meta> mimicry enables on-phone testing.
  • Multi-browser, multi-device, multi-frame, multi-screen and multi-window testing.
  • CSS refresh: adopted, external, inline, internal…
  • Color-scheme adjustment.
  • Scroll-to-bottom/top/selector.
  • Unpolluted HTML. Focus on inspecting yours.

Installation

Download and include the ProtoFluid folder in your project.

Further installation details are available in the documentation.

The ProtoFluid button

ProtoFluid can be loaded on-demand via the <protofluid-button> component.

ProtoFluidButton.js weighs in under 600 bytes!

Visit the documentation for more details.

The core ProtoFluid app is free

Silver sponsors

Interested in becoming a sponsor? Visit the sponsor page.

Privacy

ProtoFluid delivers private responsive testing.

It exists in the context of your project. It does not depend on a server and no trackers are used.

Check out the privacy policy for more detail.

Independence

ProtoFluid is completely independent of big tech and is not available via any third party service.

Do not trust code hosted on GitHub, NPM or anywhere else.

Premium addons are only available in the ProtoFluid store.

Quick on-device testing

The ProtoFluid app enables quick on-device testing.

  • Analyse viewport data from a real device.
  • Force refresh the page or just the CSS.
  • Enables phone/tablet based viewport meta testing.

Download

  • The script code is pretty small (40kB)
  • The script doesn't have to be loaded up front.
  • <protofluid-button> (0.6kB) can handle that for you.
  • Everything is in the script. No assets are fetched.
  • Zero trackers. Zero third party code.

Enhance your workflow

  • Accelerate design execution via parallel viewports.
  • Extend viewport heights. See more of your work.
  • Scalable viewports let you test large ‘screens’ on laptops.
Progress is easy to demonstrate and share.

Clients can far more easily grasp the core concept of responsive design when they can see the results.

Browser independent

The web is more than just Chromium 🤯

ProtoFluid is not limited to a single layout and rendering engine.

It allows you to use the browser, tools and extensions of your choice.

Maybe even Servo? One day…

Viewport meta mimicry

On mobile devices ProtoFluid lets you intuitively modify the viewport meta tag on-the-fly. This enables the testing of multiple viewports on a single device.

One ring phone to rule test them all.

A single device can mimic others. An iPhone and Android phone combo covers a significant amount of potential user devices.

Your phone is a device lab

There are significant benefits to testing via meta tag modification.

  • Testing takes place in realistic conditions.
  • Less device switching, charging and updating. Fewer cables!
  • Save electricity and reduce desk clutter.
  • Rapid viewport switching makes issues easy to spot.
This approach dramatically reduces testing hardware cost.