Skip to Content
UI Components/Cupertino UI/Cupertino Buttons

Cupertino Buttons

iOS-style buttons with filled and outlined variants

Framework

View in WebF Go

Download WebF Go to preview this component on devices and desktop.

Installation

Install
1npm install @openwebf/react-cupertino-ui

Usage

Buttons.tsx
1import { FlutterCupertinoButton } from '@openwebf/react-cupertino-ui';
2
3export function ButtonsExample() {
4  return (
5    <FlutterCupertinoButton variant="filled" onClick={() => console.log('Clicked')}>
6      Continue
7    </FlutterCupertinoButton>
8  );
9}

API Reference

Props (React)

NameTypeDefaultDescription
variant'plain' | 'filled' | 'tinted'plainVisual style.
size'small' | 'large'smallSize preset.
disabledbooleanfalseDisable interactions.
pressedOpacitystring0.4Opacity while pressed (0–1, as string).
disabledColorstring-Override disabled color (hex).
onClick(event: Event) => void-Fires when button is pressed.
Full type definitions: npm package docs.