Skip to Content
Pane UI

Pane UI

Pane UI brings large typography, square tiles and coordinated motion to ordinary React applications. It is an independent, framework-independent library inspired by Windows Phone. It has no affiliation with Microsoft and includes no Microsoft font or image assets.

This is a public alpha, version 0.1.0-alpha.0, available on npm under the alpha tag. The site is a working reference for the current implementation; APIs may change before 1.0.

Start with a real application

Install the package, import the stylesheet, and put your interface inside a Theme. Use TileLink for destinations, Button for commands, and native fields for input. Then add motion where it explains the change of context.

What belongs to the library

Themes, visual surfaces, native controls, accessible relationships, focus behavior for supported overlays, and interruptible motion live in the package. Your application owns data, validation policy, navigation/history, permissions and network operations. A callback asks you to update state; it never silently saves data or changes routes.

Find a component

NeedStart here
A start screen or dashboardTiles, RevealTile, LiveTile
Commands and navigationButtons, AppBar, Pivot, Panorama
Entering and leaving contentTransition and Stagger, TileSequence
User inputFields, Select and Slider, Selection controls
Status and feedbackProgressDots, Progress, MessageBanner
Temporary surfacesDialog, Menu and Popover
Collections and empty resultsLists

Read the support contract before adopting the alpha. Automated coverage is useful evidence, but manual assistive-technology and real-device release checks remain outstanding.

Last updated on