CSS and Tailwind coverage#

leptoskit implements a defined subset of CSS through built-in Tailwind utilities and typed layout properties. It does not implement a general CSS stylesheet parser or a browser engine. Full CSS includes document formatting, selectors, painting, typography, interaction, and media output beyond Yoga layout.

This audit groups behavior by the modules in the W3C CSS Snapshot 2026, published on 22 June 2026. Module names identify the relevant specification. No row claims complete module conformance. The shared utility compiler accepts the same subset on native and web, even when a browser supports additional CSS.

Modules and properties outside the listed subset have no shared CSS support contract.

Defaults and units#

Built-in components use React Native-style layout defaults on both renderers:

A root View or ScrollView fills the window's width, less its margins and within its maximum width, and grows with its content, as a div fills a web page: add min-h-screen to fill the height too. Text or a control at the root, such as a Button, keeps its own size, as inline content and form controls do on the web.

The 14-pixel text default does not change rem resolution on native. text-base sets a 16-pixel font. Named text size utilities set font size only. They do not add Tailwind's usual line height.

Arbitrary pixel widths work the same way: min-[968px]:flex from 968 logical pixels, and max-[968px]:hidden below them. Minimum widths are inclusive. max-* widths are exclusive. Browser media queries resolve rem against the browser's initial font size, so user font settings can produce different physical breakpoint widths from native. dark uses the browser's prefers-color-scheme query or the native host's set_dark_mode value.

active applies while a Button or Pressable is held down: CSS :active in a browser, and the platform's own pressed state on native. It is valid only on those two controls. While they apply, active rules override responsive and dark-mode rules, as the extra specificity of :active does in CSS. A control without active rules dims to 70 percent of its opacity while held, unless it is a Button that keeps its native chrome. Style the pressed state covers when each platform starts and ends a press.

Supported length values are px, rem, %, vw, vh, and unitless zero. Percentages are available where the property has a percentage representation. Font sizes, border widths, and radii require absolute or viewport lengths. Margin and inset utilities accept negative values. Padding and gaps reject negative values.

Padding also accepts safe and safe-offset-* values, such as pt-safe and pb-safe-offset-4. They resolve to the native host's safe-area inset for each edge, plus an absolute offset, and to env(safe-area-inset-*) in CSS. Margins, insets, and negative safe-area padding are not supported.

Parsed numeric magnitudes are bounded to one million, including computed fractions; overflowing conversions are errors. Native viewport-length calculations use wider intermediates and cap their results at one billion logical pixels. max-w-none and max-h-none remove a maximum; automatic min/max content sizing is outside the utility subset.

Layout modules#

Text, painting, and images#

Stylesheets, queries, and interaction#

Diagnostics#

.try_class and Tailwind::parse return ClassError { class, reason }. .class panics with the same diagnostic. Unsupported tokens are errors on both renderers, including tokens inside inactive variants. Typed low-level fields can expose behavior outside the portable utility subset. Their presence is not a CSS parity guarantee.