Foundations
Icons
Badho DS uses Phosphor Icons — a flexible family of icons available in 6 weights. Click any icon to copy its name.
Size
Color
68 / 68 iconsIcon Library
Powered by Phosphor Icons. Click any icon to copy its name for use in components.
Usage
Import icons directly from @phosphor-icons/react and use the weight prop for style variants.
import { MagnifyingGlass, Bell, User } from '@phosphor-icons/react'
// Regular weight (default)
<MagnifyingGlass size={24} />
// With weight and color
<Bell size={20} weight="fill" color="#892CDC" />
// Regular weight (default)
<MagnifyingGlass size={24} />
// With weight and color
<Bell size={20} weight="fill" color="#892CDC" />
Weight Showcase
The same icon rendered across all 6 weights.
thin
light
regular
bold
fill
duotone