Json To Product Card MCP tool
MCP
findutils:json_to_product_card Generate an e-commerce product card from JSON such as {"name","price","originalPrice","currency","rating","reviews","badges"} in one of 6 templates. Returns the card three ways: inline-style HTML, Tailwind CSS markup, and a React JSX component.
Arguments
application/json-
json
string required
Product JSON: {"name": string, "price": number, "originalPrice"?: number, "currency"?: string, "image"?: url, "rating"?: 0-5, "reviews"?: number, "description"?: string, "badges"?: string[], "inStock"?: boolean, "category"?: string}.
-
template
string optional
Card template. Default "classic". One of
classic · modern · dark · horizontal · minimal · gradient. Default"classic".
Example arguments
Verified{
"json": {
"name": "Premium Wireless Headphones",
"price": 149.99,
"originalPrice": 199.99,
"currency": "$",
"rating": 4.5,
"reviews": 1284,
"badges": [
"Best Seller"
],
"inStock": true
}
} More Generators tools
- Barcode Generator Generate a 1D barcode as an SVG string from text.
- Box Shadow Generator Generate a CSS box-shadow declaration from offset, blur, spread, colour, opacity, and inset settings, or from a named preset (subtle, soft…
- Caption Generator Generate a social-media caption from a topic using built-in templates (no AI): picks a template for the content type and tone, fills…
- Clip Path Generator Generate a CSS clip-path from a named shape (triangle, trapezoid, parallelogram, rhombus, pentagon, hexagon, octagon, star, chevron…
- Color Palette Generator Generate a harmonious colour palette from a base hex colour: complementary, analogous, triadic, tetradic, split-complementary…
- Css Animation Generator Return CSS @keyframes animation code (or Tailwind config, Web Animations API / React, or Framer Motion code) from a named preset such…