glide-design-system/src/lib/components/chip/chip.css

Glide design system is an open-source React component library. It offers numerous benefits that make them essential tools for design and development teams.

/* Base styles for the chip */
.chip {
    display: inline-flex;
    align-items: center;
    border-radius: 5px;
    padding: 5px 8px;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
  }
  
  /* Styles for different states */
  .success {
    background-color:rgba(76, 175, 80, 0.99);
    color: white;
  }
  
  .warning {
    background-color: rgb(254, 174, 95);
    color: white;
  }
  
  .info {
    background-color:rgb(2, 167, 240);
    color: white;
  }
  
  .error {
    background-color: #ee4357;
    color: white;
  }
  
  .disable {
    background-color: #808080;
    color: white;
  }