# SD Types

* **Color** (`$type` value: `color`)
  * Colors in Hex, RGB, HSL, or standard names.  ("#00ff00" or "rgba(0,0,0,0.5)" )
* **Size** (`dimension`)
  * Measurements with units (px, rem, em, %, etc.).  ("16px", "1.5rem", "50%" )
* **Number** (`number`)
  * Pure numeric values ​​without units (e.g., opacity).  (0.75, 1.2, 100 )
* **Duration** (`duration`)
  * Time intervals for animations and transitions.  ("200ms", "0.5s" )
* **Time Curve** (`cubicBezier`)
  * Array of 4 numbers for easing curves.  ([0.42, 0, 0.58, 1] )
* **Font Family** (`fontFamily`)
  * Name of the font family or list (array).  ("Inter", ["Helvetica", "Arial"] )
* **Font Weight** (`fontWeight`)
  * Font weight (number or text alias).  (700, "bold", "light" )

## compounds: 

* **border** (`border`)
  * Compound: requires color, width, style.  ({"color": "#000", "width": "1px", "style": "solid"} )
* **Shadow** (`shadow`)
  * Compound: color, offsetX, offsetY, blur, spread, inset.  ({"color": "#0003", "offsetX": "0px", "offsetY": "4px", "blur": "10px"} )
* **Typography** (`typography`)
  * Compound: fontFamily, fontSize, fontWeight, lineHeight, letterSpacing.  ({"fontFamily": "Inter", "fontSize": "16px", "fontWeight": 400} )
* **Gradient** (`gradient`)
  * Compound: Array of "stops" (color and position).  ([{"color": "#000", "offset": 0}, {"color": "#fff", "offset": 1}] )
* **Stroke Style** (`strokeStyle`)
  * Compound: Defines line patterns (dashes).  ({"dashArray": ["4px", "2px"], "lineCap": "round"} )