Three platforms, one Button. Same hover state, same focus ring, the same 16px radius. When it works, it's the closest thing to a free lunch engineering has ever shipped — you write <Button> once and your web app, your iOS build, and your Android build all pick up the change.
When it doesn't work, you find out at the worst possible moment. Your designer hands you a Figma with a 12px radius update and you discover that "cross-platform" was a wish, not a fact. The Button on web rounded to 12. The Button on iOS is still 16. The Button on Android is whatever the platform defaults decided. You have three components now, pretending to be one.
This post is about the part of cross-platform that nobody puts on a launch slide: keeping the components in lockstep after the demo stops recording. OTF ships a pattern for it — same component name, same props, same look — across web and native, with one API surface. Below is what that actually looks like in code, why it holds up under an AI agent's worst impulses, and the small set of habits that keep it from drifting.
1. The cross-platform dream, stated honestly
A few things are genuinely true in 2026 that were not true five years ago:
