👩‍💻
Builder Portal
  • Sovryn Builder Portal
    • Contribution
  • Design System
    • Design principles
    • Structure
    • Usage by Sovryn
  • UI Library
    • Overview
    • Getting Started
    • Atoms
      • Accordion
      • Badge
      • HealthBar
      • Button
      • DynamicValue
      • Heading
      • ErrorBadge
      • Icon
      • Input
      • Lottie
      • Paragraph
      • Toggle
      • Link
      • Checkbox
    • Molecules
      • AmountInput
      • ContextLink
      • Dialog
      • Dropdown
      • ErrorList
      • Footer
      • FormGroup
      • Header
      • HelperButton
      • Menu
      • NavMenuItem
      • Notification
      • Overlay
      • Pagination
      • RadioButton
      • RadioButtonGroup
      • Select
      • SimpleTable
      • StatusItem
      • Table
      • TableBase
      • Tabs
      • Tooltip
      • TransactionId
      • VerticalTabs
      • VerticalTabsMobile
      • WalletContainer
      • WalletIdentity
    • Working with Components
    • Links
    • Contribution
  • Sovryn SDK
    • Smart Router
      • Creating a New Swap Route
      • Available routes
        • AMM
        • MoC integration
        • MYNT bAsset
        • MYNT fixed rate
    • Sovryn Onboard
      • Installation
      • Usage
      • Custom Connectors
      • Custom UI
      • Contribution
    • The Graph
      • Overview
      • Usage
      • Sovryn Subgraphs
      • Advanced Usage
  • sovryn.app
    • Overview
    • Sovryn UI Library Usage
    • The Graph Usage
    • Links
    • Contribution
    • Dapp specific components
      • MaxButton
  • Smart Contracts
    • Overview
    • AMM
      • Liquidity
        • V1 Converters
        • V2 Converters
      • Conversion
      • Wrapper
        • V1 liquidity
        • V2 liquidity
        • Swaps
    • Sovryn Protocol
      • Lending
        • Mint
        • Burn
      • Borrowing
        • Borrow
        • Repay
      • Margin Trading
        • Open
        • Close
      • Collateral Management
    • Liquidity Mining
      • Deposit
      • Withdraw
      • Rewards
    • FastBTC
      • RSK->BTC
    • Bitocracy
      • Staking
      • Governor
      • Fee Sharing
      • Vesting
    • Zero
      • Borrower operations
      • Trove Manager
      • Satability Pool
      • Rewards
    • Mynt & DLLR
      • Basset to Masset Conversion
      • Masset to Basset Conversion
      • MOC Integration Conversion
Powered by GitBook
On this page
  • Description
  • Figma
  • Usage Examples (Storybook)
  1. UI Library
  2. Atoms

Badge

PreviousAccordionNextHealthBar

Last updated 1 year ago

Description

Toggle is a control that is used to quickly switch between two possible states. Toggles are only used for these binary actions that occur immediately after the user “flips the switch”. They are commonly used for “on/off” switches.

Scale labels variations (future dev) We’ll add an option for labels inside the toggle switch

Figma

Usage Examples (Storybook)

LogoWebpack App
Not found