Chips in Applaud are boolean properties shown as small, colored blocks that sit within a list item to visually illustrate a status or action. They provide at-a-glance insights without needing to open the full record.
Example uses of chips
| HR scenario | Chip label | What it shows |
|---|---|---|
| Leave management | On annual leave | Highlights employees currently away from work. |
| Leave management | Unpaid leave | Emphasizes exceptions rather than normal cases, making it clear when an employee is not on paid leave. |
| Performance management | Probation | Flags employees still in their probationary period. |
| Recruitment | Shortlisted | Indicates candidates who have progressed to the shortlist stage. |
| Training & development | Certified | Marks employees who have completed a specific training or certification. |
Example of a chip on a list bock indicating the person is on annual leave:
Chip design guidelines
- Label length: Keep chip text short (1–3 words). Longer labels reduce readability.
-
Color coding:
- Green for positive states (for example, "Certified", "On Leave").
- Red for alerts or exceptions (for example, "Unpaid", "Overdue").
- Grey or neutral for inactive states (for example, "Closed", "Inactive").
- Consistency: Apply the same colors and labels across your HR system to avoid confusion.
- Accessibility: Ensure chip colors meet contrast standards and always pair color with text so meaning isn’t lost for color-blind users.
- Quantity: Limit to one or two chips per list item. Too many chips create visual noise.
Best practices
- Use chips to highlight exceptions or important statuses rather than common states, so the most relevant information stands out.
- Keep chip labels short and action-oriented (for example, "On Leave", "Unpaid", "Probation").
- Apply consistent colors across your HR system (for example, green for positive, red for alerts, grey for inactive).
- Limit the number of chips per item to avoid visual clutter.