{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "shiori",
  "title": "Shiori",
  "description": "A clean, minimal Open Graph image with a light cream background, an orange gradient circle logo, and a bold title beside a muted description.",
  "files": [
    {
      "path": "registry/components/shiori/index.tsx",
      "content": "export interface ShioriProps {\n  background: string;\n  brand: string;\n  brandColor: string;\n  logo: string;\n  title: string;\n  titleColor: string;\n}\n\nexport const Shiori = ({\n  title,\n  background,\n  titleColor,\n  logo,\n  brand,\n  brandColor,\n}: ShioriProps) => (\n  <div\n    style={{\n      backgroundColor: background,\n      display: \"flex\",\n      flexDirection: \"column\",\n      height: \"100%\",\n      padding: \"60px\",\n      position: \"relative\",\n      width: \"100%\",\n    }}\n  >\n    <img\n      alt=\"\"\n      height={96}\n      src={logo}\n      width={96}\n      style={{\n        borderRadius: \"50%\",\n        objectFit: \"contain\",\n      }}\n    />\n\n    <div\n      style={{\n        bottom: \"60px\",\n        display: \"flex\",\n        justifyContent: \"space-between\",\n        left: \"60px\",\n        position: \"absolute\",\n        right: \"60px\",\n      }}\n    >\n      <div\n        style={{\n          color: brandColor,\n          flex: 0.25,\n          fontSize: \"64px\",\n          fontWeight: 600,\n          letterSpacing: \"-0.03em\",\n          lineHeight: 1.3,\n        }}\n      >\n        {brand}\n      </div>\n\n      <div\n        style={{\n          color: titleColor,\n          flex: 0.6,\n          fontSize: \"64px\",\n          fontWeight: 600,\n          letterSpacing: \"-0.03em\",\n          lineHeight: 1.3,\n        }}\n      >\n        {title}\n      </div>\n\n      <div style={{ flex: 0.25 }} />\n    </div>\n  </div>\n);\n",
      "type": "registry:component",
      "target": "components/og/shiori.tsx"
    }
  ],
  "type": "registry:component"
}