The Segmented Control is a component that lets users toggle between up-to-4 options in a row.
A segmented control is a set of two or more button segments. Within the control, all segments are equal in width.
A segmented control is often used to switch between views of some data. Use a segmented control only when the options are predefined and are at most 4 options.
By default the segmented control has a height of 32px (the same as a button).
You should however keep things on the 8px grid or in some cases the 4px grid.
You should only need the following recommended heights.
The SegmentedControl will automatically chose the text style to match whatever size is passed.