Resize panes
Source
Edit the component, then preview updates on the right.
Resize panes
ChatGPT
Add your OpenAI API key to chat. Conversations use the current source as context.
Your key stays on this device and is only used for your ChatGPT requests.
ChatGPT
Enter your key in the OpenAI API key field above, then ask about this source, props, layout, or how to reshape the example. Your key stays on this device.
Preview
Live render of your edited component.
Background Blobs control lab
Test real controls over a moving colour field and compare light and dark component surfaces.
Light component surfaceLive samples enabledFilter
48 / 120
48 / 120 characters
Priority
Opacity
62%
0%100%
25 – 75
0100
Empty
- At least 8 characters
- One uppercase letter
- One lowercase letter
- One number
Verification code
Colour picker
Neutral statusInfo statusSuccess statusWarning statusDanger status