# Ω Size Dictionary

For objects on the screen we want to adhere to sizing standards as much as we can to create a consistent look and feel across our visual elements. To accomplish this we have sizing standards that are associated with different objects (i.e. Grids, Spacing, Icons, Avatars, Images and Button).

There are various sizing types (grid, spacing, radius, object width & height, timing, etc.) that are a part of the design system that are used to design our components and screen layouts. This is where we group those individual sizes together into use case dependent dictionaries. These are then used by our elements and components to provide the sizing options available to that object.

The design system starts with a few base dictionaries (grid, spacing, radius etc.). More can be added as needed to accommodate the needs of the system as it grows. As a sub-category under this "Size" page is where we list each of these base dictionaries with their usage, properties, and JSON details.

### Properties

**Name**: \[textField] The human readable dictionary name for this "Size" option. (i.e. spacing, radius, etc.)

**Type**: \[selectList] The family grouping for this size i.e. Radius, Image, Grid…

**Thumbnail**: \[fileAdd - optional] The visual to represent this object

**Description**: \[textArea - optional] Context to understand what the object is

**Token**: \[textField] The short-code we use to refer to this dictionary (i.e.. #dicSpacing, #dicRadius etc.)

A single dictionary "source of truth" can then be referenced across multiple elements, components and screens to provide the size properties for that object in the design system.

## Add Entry

These are the individual "entries" added to this size dictionary. As an example we have an Icon Size "Dictionary" which is referenced from all icons in the design system. That dictionary has options of Small, Medium, Large. Now when we are building a component with an icon in it, we have those options and only those options available to us, which enforces consistency throughout the design.

### Properties

**Name**: \[textField] The human readable way we refer to this "Size" option in the Dictionary.

**Value**: \[slider-tick(1-99;12)] This is the digital pixel size

**Base**: \[toggle(on,off;off)] Makes this entry the default "base" value.

**Token**: \[textField] The short-code we use to refer to this metaphor (i.e.. #szSm, #szMed, #szLrg, etc.)


---

# 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/overview/styles/size.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.