Legend Beta React-only
Legend serves for providing accessible information related to a chart, a Meter, or a similar component that requires distinction between colors.
Rules For Developers
- Neither Legend nor LegendItem provides an option to enforce the font weight of labels and values. To achieve e.g. a semi-bold value, the
childrenmust take care of it themselves. - When you pair Legend with a Meter, make sure to omit the
coloron the last LegendItem (as opposed to setting it to$color-gray-200 (#e4eaf0)). This ensures that it matches the remainder of the meter, otherwise it will run out of sync the moment Meter gets a different background colour.