# Recipe: input
Build one input component that matches this brand.
Palette: #000000, #ffffff, #0080ff, #2ca8ff, #ec0853
Typography: [object Object], [object Object]
Material: flat
Signals: Use plain Tailwind CSS without a component library. · Radius: 4, 8, 12, 16, 24, 32 · Shadows: rgba(0, 0, 0, 0) 0px 0px 0px 0px, oklab(0.129999 -0.00404751 -0.027702 / 0.08) 0px 0px 0px 1px inset, 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, oklab(0.999994 0.0000455678 0.0000200868 / 0.1) 0px 0px 0px 1px inset, 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, 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.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px
## Anatomy (detected)
```json
{
  "kind": "input",
  "structuralHash": "input",
  "instanceCount": 1,
  "variants": [
    {
      "css": {
        "background": "rgba(0, 0, 0, 0)",
        "color": "rgb(0, 0, 0)",
        "padding": "0px 0px 0px 0px",
        "borderRadius": "0px",
        "border": "0px solid rgb(0, 0, 0)",
        "fontSize": "16px",
        "fontWeight": "400"
      },
      "instanceCount": 1
    }
  ]
}
```