DevDocs.ai

gluestack playground

Overview

Shell map and delivery status

Tokens

Color, type, spacing, radii, and motion

System

Gluestack provider and universal base

Components

Full gluestack website component catalog

Primitives

Original primitive states and recipes

Blocks

Copy-paste block catalog shell

Preview

Light, dark, desktop, tablet, mobile, and Expo Go frames

Expo Go

Phone QR and Metro launch runbook

Universal

Web and Expo render the same gluestack app shell, route content, tokens, and settings surface.

Components

Full gluestack component catalog

40 official gluestack website components are mapped to DevDocs tokens, creator targets, native roots, states, and responsive preview cards.

Open Expo Go

Official components

Creator-wired base

Surfaces

Web + Expo

Catalog filter

Dark

40 gluestack component previews

Each card maps the official gluestack website component to the DevDocs token contract, native root, state coverage, and Expo-compatible preview surface.

Typography

previewed

Heading

Text recipe / Text

Heading

Portable RN preview

https://gluestack.io/ui/docs/components/heading

Typography

previewed

Text

Text recipe / Text

Text

Portable RN preview

muted

strong

link

caption

https://gluestack.io/ui/docs/components/text

Layout

previewed

Box

View recipe / View

Box

Portable RN preview

surface

border

elevated

https://gluestack.io/ui/docs/components/box

Layout

previewed

Center

View recipe / View

Center

Portable RN preview

both

https://gluestack.io/ui/docs/components/center

Layout

previewed

Divider

View recipe / View

Divider

Portable RN preview

horizontal

vertical

subtle

https://gluestack.io/ui/docs/components/divider

Layout

cataloged

Grid

View recipe / View

Grid

Portable RN preview

two-column

dense

responsive

https://gluestack.io/ui/docs/components/grid

Layout

previewed

HStack

View recipe / View

HStack

Portable RN preview

gap

wrap

center

https://gluestack.io/ui/docs/components/hstack

Layout

previewed

VStack

View recipe / View

VStack

Portable RN preview

gap

section

stack

https://gluestack.io/ui/docs/components/vstack

Feedback

creator wired

Alert

createAlert / View + Text

Policy passed with citations.

info

success

warning

error

https://gluestack.io/ui/docs/components/alert

Feedback

creator wired

Progress

createProgress / View

value

indeterminate

tone

https://gluestack.io/ui/docs/components/progress

Feedback

previewed

Spinner

ActivityIndicator recipe / ActivityIndicator

Loading states

size

tone

https://gluestack.io/ui/docs/components/spinner

Feedback

cataloged

Toast

createToast / View + Text

Toast

Portable RN preview

title

description

placement

https://gluestack.io/ui/docs/components/toast

Data Display

previewed

Badge

Text + View token recipe / View + Text

Ready

Review

neutral

success

warning

danger

https://gluestack.io/ui/docs/components/badge

Data Display

creator wired

Card

createPressable / Pressable + View

Card

Portable RN preview

pressed

disabled

selected

https://gluestack.io/ui/docs/components/card

Data Display

cataloged

Table

View + Text recipe / View + Text

Component

wired

State

ready

header

row

cell

https://gluestack.io/ui/docs/components/table

Forms

creator wired

Button

createButton / Pressable

hover

pressed

disabled

focusVisible

https://gluestack.io/ui/docs/components/button

Forms

creator wired

Checkbox

createCheckbox / Pressable + View

Selected option

checked

unchecked

disabled

invalid

https://gluestack.io/ui/docs/components/checkbox

Forms

cataloged

FormControl

createFormControl / View + Text

Prompt

Summarize the source with citations...

required

invalid

helper

disabled

https://gluestack.io/ui/docs/components/form-control

Forms

creator wired

Input

createInput / TextInput

focus

invalid

disabled

readonly

https://gluestack.io/ui/docs/components/input

Forms

creator wired

Link

createLink / Pressable + Text

Link

Portable RN preview

default

hover

visited

disabled

https://gluestack.io/ui/docs/components/link

Forms

creator wired

Pressable

createPressable / Pressable

Pressable

Portable RN preview

hover

pressed

focus

disabled

https://gluestack.io/ui/docs/components/pressable

Forms

creator wired

Radio

createRadio / Pressable + View

Selected option

selected

unselected

disabled

invalid

https://gluestack.io/ui/docs/components/radio

Forms

cataloged

Select

createSelect / Pressable + TextInput + Overlay

Select

Portable RN preview

placeholder

selected

open

disabled

https://gluestack.io/ui/docs/components/select

Forms

creator wired

Slider

createSlider / View + Pressable

value

dragging

disabled

https://gluestack.io/ui/docs/components/slider

Forms

creator wired

Switch

createSwitch / Switch

Dark mode

checked

disabled

invalid

hover

https://gluestack.io/ui/docs/components/switch

Forms

creator wired

Textarea

createTextarea / TextInput multiline

Prompt

Summarize the source with citations...

focus

invalid

disabled

resize

https://gluestack.io/ui/docs/components/textarea

Overlay

cataloged

AlertDialog

createAlertDialog / Modal + View

Open AlertDialog

Layered native surface

open

closed

destructive

confirm

https://gluestack.io/ui/docs/components/alert-dialog

Overlay

cataloged

Drawer

CLI drawer template / Modal + View

Open Drawer

Layered native surface

left

right

open

closed

https://gluestack.io/ui/docs/components/drawer

Overlay

cataloged

Portal

OverlayProvider / Portal host

Open Portal

Layered native surface

mounted

layered

dismissed

https://gluestack.io/ui/docs/components/portal

Disclosure

creator wired

Accordion

createAccordion / View + Pressable

Evidence chain

Open state keeps content inside the native layout tree.

expanded

collapsed

disabled

https://gluestack.io/ui/docs/components/accordion

Disclosure

cataloged

Actionsheet

createActionsheet / Modal + Pressable

Open Actionsheet

Layered native surface

open

closed

dragging

item

https://gluestack.io/ui/docs/components/actionsheet

Media And Icons

creator wired

Avatar

createAvatar / View + Image + Text

image

fallback

badge

group

https://gluestack.io/ui/docs/components/avatar

Media And Icons

cataloged

Icon

createIcon / react-native-svg

size

stroke

filled

https://gluestack.io/ui/docs/components/icon

Media And Icons

cataloged

Image

createImage / Image

[]

loaded

fallback

alt

https://gluestack.io/ui/docs/components/image

Others

creator wired

Fab

createFab / Pressable

hover

pressed

placement

disabled

https://gluestack.io/ui/docs/components/fab

Others

cataloged

Skeleton

View recipe / View

circle

text

card

https://gluestack.io/ui/docs/components/skeleton