Without LotOS UI
Plain HTML / React
function PlainButton() {
return <button className="plain-btn">Ship change</button>;
}Preparing the registry-backed surface.
LotOS UI Playground
Left: plain HTML or React. Right: the same job with LotOS UI. Free components copy immediately. Pro components stay runnable in-browser but keep the package and source behind checkout.
Selected
Primary action surface.
Without LotOS UI
function PlainButton() {
return <button className="plain-btn">Ship change</button>;
}With LotOS UI
import { Button } from '@lotosui/claude-arm';
<Button variant="primary">Ship change</Button>;Public npm package
Ships the free adoption layer: Button, Input, Alert, Badge, Card, Spinner, Divider and EmptyState.
npm install @lotosui/claude-armPremium npm package
Ships the protected component layer, richer interaction patterns and the surfaces that are expensive to rebuild.
npm install @lotosui/claude-arm-pro