# Φ Icon

Primitive: Used in building element and components. An icon is used as a metaphor for an action, object, concept. Here we standardize the sizes for all icons used in the design system.

[Styleguide Link](https://zpl.io/VOyNZDY)

* Parent: [Label](/core/overview/label.md), Many others
* Child: [Badge](/core/overview/badge.md)

### Properties

**Size** - The general size of the element in proportion to the others in the collection.

<figure><img src="/files/wCkYe2G5pKMAFPpMqwZ8" alt=""><figcaption></figcaption></figure>

* XSmall (12dp)
* Small (16dp)
* SMedium (20dp)
* Medium (24dp)
* Large (32dp)
* XLarge(40dp)
* XXLarge(48dp)
* Huge (64dp)

**Badge** - Every icon has the possibility of having a badge in the upper right corner. This is commonly used with icons especially on tabs to represent new activity in that area of the app.

**State** - The different appearances of the screen object based on interaction and the status of the screen object. Possible states are Enabled, Disabled, Hover, Pressed, Focused.

<figure><img src="/files/RUNyZmw0hkzs4leZChPf" alt=""><figcaption></figcaption></figure>

### Why

By constraining the icon sizes here we maintain a consistency throughout the application. Additional sizes could be added at this level to increase the options available at parent levels. Only the sizes listed here should be used in the application.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://able.bucca.com/core/overview/icon.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
