Skip to content

ItemCardGroup

FLEX
Included

Group content and actions into configurable card layouts.

Standalone Variants

Self-contained surfaces with variant styling when used outside ItemCardGroup.

Vertical Stack

Standalone pressable cards with spacing between each surface.

With Select

Standalone card with an item-card select trailing action.

Language Choose your preferred language

With Switch

Standalone card with an inline switch trailing action.

Dark mode Use dark theme across the app

Title Only

Minimal standalone card with title and chevron.

Without Icon

Standalone card with trailing action button and no leading icon.

Delete account Permanently remove your account and all data

Leading Image

Use image() instead of icon(), or omit both for a text-only row.

Pressable (Group)

Pressable rows inside ItemCardGroup — flat rows with shared surface.

Account

Manage your account settings and preferences

Variants

Surface styles and separated rows with chevron navigation.

Default

Surface background with shadow

Secondary

Secondary surface, no shadow

Tertiary

Tertiary surface, no separators

Outline

Transparent with border, no shadow

ItemCardGroup

SaaS item-card-group layout with mixed switch and item-card select actions.

Source Control

GitHub Connected as @jrgarciadev on GitHub
GitLab Connect GitLab for repository management
Connect

Settings

Manage your account preferences and notification channels

Language Enable automatic language detection
Event Invites How you receive event invitations
Theme Follow your system appearance
Event Reminders Reminder delivery channels
Dark mode Override system theme on this device
Marketing Promotional messages and updates
Hold confirm Hold the button until it fills to trigger the action
Hold confirm (fast) 800ms hold, sweep from the right
Hold confirm (slow) 4s hold, sweep from the left
Loading code examples…

Information

Developer
FLEX
Category
Collections
Website