'%3e%3crect%20width='100'%20height='100'%20rx='32'%20fill='white'/%3e%3crect%20x='38'%20y='-19'%20width='100'%20height='152'%20rx='32'%20fill='url(%23paint0_linear_232_25)'/%3e%3crect%20x='-46'%20y='-40'%20width='100'%20height='100'%20rx='32'%20fill='url(%23paint1_linear_232_25)'/%3e%3crect%20x='-21'%20y='53'%20width='100'%20height='100'%20rx='32'%20fill='url(%23paint2_linear_232_25)'/%3e%3c/g%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_232_25'%20x1='68.5'%20y1='1.5'%20x2='132.327'%20y2='74.2422'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23FFDBDC'/%3e%3cstop%20offset='1'%20stop-color='%23FF24F0'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_232_25'%20x1='32.5'%20y1='31.5'%20x2='-18.5'%20y2='-17.5'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23BCFDFF'/%3e%3cstop%20offset='1'%20stop-color='%2338FF50'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint2_linear_232_25'%20x1='55.5'%20y1='50'%20x2='23'%20y2='97.5'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%239ED0FF'/%3e%3cstop%20offset='1'%20stop-color='%230084FF'/%3e%3c/linearGradient%3e%3cclipPath%20id='clip0_232_25'%3e%3crect%20width='100'%20height='100'%20rx='32'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e)
Basic Components
These are the primary components for callouts, inline tags, and command lines.
1. Alert & Callout
Provides context-sensitive feedback messages for users. Supported types/variants: default (Note), info (Info), success (Success), warning (Warning), destructive (Danger).
Info Alert
This is a whitelisted alert component rendering in live demo mode.
2. Badge
Compact labels used to highlight metadata or states.
Supported variants: default, secondary, destructive, outline.
Here is a badge in action:
DefaultSecondaryDestructiveOutline3. Command
Interactive command container for terminal instructions with built-in clipboard copying.