Axon 911 Frontend DocsAxon 911 Frontend Docs
Axon 911 Frontend Docs
    Loading navigation…
U
User
Switch to light mode
  1. Primitives
  3. Circle
  5. Usage

Circle

Usage

Overview
There is no Circle component. A photo or initials in a circle is Avatar from @prepared911/ui/avatar (AvatarShape.Circle is the default). A count or status tag is Badge. A small status marker is Status dot.
When to use Avatar
  • A person or entity, as a photo or initials.
  • The mark should stay non-interactive. Wrap it in a button or link when it should be clickable.
When not to use Avatar
  • A count that is not an identity: use Badge.
  • Status with no name: use StatusDot next to text.
  • Anonymous or system actors: use an Icon or a text label.
Related Components
  • Avatar for identity.
  • Badge for counts and tags.
  • Status dot for lightweight state.
Previous
Box / API and Development
Next
Circle / API and Development
On this page
Overview
When to use Avatar
When not to use Avatar
Related Components