# Recipe: button
Build one button component that matches this brand.
Palette: #171717, #ebebeb, #4d4d4d, #ffffff, #666666, #000000
Typography: [object Object], [object Object]
Material: material-you
Signals: Radius: 2, 5, 8, 16, 32, 50 · Shadows: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(255, 255, 255) 0px 0px 0px 2px, rgb(0, 114, 245) 0px 0px 0px 4px | rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(235, 235, 235) 0px 0px 0px 1px | rgb(235, 235, 235) 0px 0px 0px 1px
## Anatomy (detected)
```json
{
  "kind": "button",
  "structuralHash": "button",
  "instanceCount": 3,
  "variants": [
    {
      "css": {
        "background": "rgba(0, 0, 0, 0)",
        "color": "rgb(23, 23, 23)",
        "padding": "14px 2px 14px 2px",
        "borderRadius": "0px",
        "border": "0px 0px 2px none none solid rgb(23, 23, 23)",
        "fontSize": "14px",
        "fontWeight": "400"
      },
      "instanceCount": 3
    }
  ]
}
```