Pluralsight Design System
INTRODUCTION
Install
Design assets
Contribute
Roadmap
CORE
Color
Motion
Spacing
Typography
COMPONENTS
Action Menu
Avatar
Badge
Banner
Breadcrumb
Button
Card
Checkbox
Circular Progress
Code
Date Picker
Dialog
Drawer
Dropdown
Errors
Form
Icon
Layout
Link
Radio
Row
Switch
Tab
Table
Tag
Text
Text Area
Text Input
Theme
Tooltip
View Toggle
PATTERNS
Iconography
Voice & tone

Badge
CHANGELOG

Install the component dependency:

Include a React component in your project:

PropTypes

Name
Value
Description
Default
appearance
default | stroke
visual style (from Badge.appearances)
default
color
gray | green | yellow | red | blue
badge color (from Badge.colors)
gray

Appearance

In either solid or stroked styles.

Colors

Colors come from the Design System. Semantics come from your heart.