📖 Step 3: Design - UI Components & Patterns#73 / 291
FAB
Floating Action Button
📖One-line summary
A circular action button floating at the bottom-right of the screen.
✨Example
Click the + button at the bottom right
⚡Vibe coding prompt examples
>_
Build a FAB (Floating Action Button) that floats at the bottom right. On click, animate 3 sub-buttons fanning out upward.
>_
Build a 'compose' FAB. As the user scrolls down, shrink it to icon-only; on scroll up, reveal the 'New post' text.
>_
Make the FAB toggle a chat widget. Show a message icon, and show a numeric badge if there are unread messages.
Try these prompts in your AI coding assistant!