IconButton
IconButtons are specific instances of a Button, where the only content is an icon.
Usage
- An IconButton is just like a regular Button and accepts any icons from Chameleon Icons.
- IconButtons have the same variations for its appearance as the Buttons, but with an additional default appearance.
Appearance
1. Default Button
The Button that fits its surroundings better by inheriting its text color, making it a versatile option for cases where there is no clear distinction between the importance of the action.
2. Primary Button
Each page should contain only one primary CTA. It is used when an action is clearly more important than other actions and acquires the users attention.
3. Secondary Button
The secondary Button is the standard Button for most use cases.
4. Tertiary Button
Should be used for the most minor pronounced actions. Often used inside elements with colored backgrounds.
Shape
The default shape of the IconButton is squared, but can be customized to a circular shape when needed.
Size
IconButtons come in two sizes, small 32px and large 48px.