{"success":true,"data":{"block":{"id":"feature-icon-grid-muted","name":"Feature Icon Grid Muted","title":"Feature Icon Grid Muted","category":"Features","categorySlug":"features","description":"Five-feature grid with muted background and icon badges showcasing key capabilities. Muted background section with centered header and five-column grid of bordered cards with icons.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290487/nxbwvthsc5scybc93omyxysclpwb/feature-icon-grid-muted-desktop.png","mobile":"https://cdn.ing/assets/i/r/290486/2cf0e4wadrm4et4i982eh381ph6u/feature-icon-grid-muted-mobile.png"},"componentPath":"blocks/features/feature-icon-grid-muted.tsx","code":"import { FeatureIconGridMuted } from \"@opensite/ui/blocks/features/feature-icon-grid-muted\";\n\nexport default function Demo() {\n  return (\n    <FeatureIconGridMuted\n      title=\"Key Features That Save You Time\"\n      description=\"Explore tools specifically built to enhance your workflow and boost productivity across your entire team.\"\n      features={[\n        {\n          iconName: \"lucide/check-circle-2\",\n          title: \"Instant Approvals\",\n          description:\n            \"Streamlined approval workflows with one-click confirmations and automated routing.\",\n        },\n        {\n          iconName: \"lucide/clock\",\n          title: \"Time Tracking\",\n          description:\n            \"Built-in time tracking that integrates seamlessly with your existing tools and workflows.\",\n        },\n        {\n          iconName: \"lucide/users\",\n          title: \"Team Collaboration\",\n          description:\n            \"Real-time collaboration features that keep everyone on the same page, always.\",\n        },\n        {\n          iconName: \"lucide/file-text\",\n          title: \"Smart Documents\",\n          description:\n            \"Document management with version control, templates, and intelligent search.\",\n        },\n        {\n          iconName: \"lucide/bell\",\n          title: \"Highlight a Feature\",\n          description:\n            \"Intelligent alerts that surface what matters most and reduce notification fatigue.\",\n          className: \"col-span-1 md:col-span-2 bg-black text-white\",\n          titleClassName: \"text-white\",\n        },\n      ]}\n      spacing=\"xl\"\n      background=\"muted\"\n      pattern=\"grid1\"\n      patternOpacity={1}\n    />\n  );\n}","propsSchema":{"title":{"type":"object","description":"Main heading content","typeLabel":"React.ReactNode","required":false},"description":{"type":"object","description":"Supporting description content","typeLabel":"React.ReactNode","required":false},"features":{"type":"array","description":"Array of items to display","items":{"type":"object","description":"","fields":{"icon":{"type":"object","description":"Icon element (overrides iconName)","typeLabel":"React.ReactNode","required":false},"iconName":{"type":"string","description":"Icon name in format: prefix/name (e.g., \"lucide/check-circle-2\")","required":false},"title":{"type":"object","description":"Item title content","typeLabel":"React.ReactNode","required":false},"description":{"type":"object","description":"Item description content","typeLabel":"React.ReactNode","required":false},"className":{"type":"string","description":"Additional CSS classes for the item","required":false},"iconClassName":{"type":"string","description":"Additional CSS classes for the icon","required":false},"titleClassName":{"type":"string","description":"Additional CSS classes for the title","required":false},"descriptionClassName":{"type":"string","description":"Additional CSS classes for the description","required":false},"href":{"type":"string","description":"Optional href for the item","required":false}},"typeLabel":"FeatureIconGridMutedItem"},"typeLabel":"FeatureIconGridMutedItem[]","required":false,"minItems":3,"maxItems":9},"featuresSlot":{"type":"object","description":"Custom slot for rendering items (overrides features array)","typeLabel":"React.ReactNode","required":false},"className":{"type":"string","description":"Additional CSS classes for the section","required":false},"containerClassName":{"type":"string","description":"Additional CSS classes for the container","required":false},"headerClassName":{"type":"string","description":"Additional CSS classes for the header","required":false},"titleClassName":{"type":"string","description":"Additional CSS classes for the title","required":false},"descriptionClassName":{"type":"string","description":"Additional CSS classes for the description","required":false},"gridClassName":{"type":"string","description":"Additional CSS classes for the grid","required":false},"cardClassName":{"type":"string","description":"Additional CSS classes for each card","required":false},"background":{"type":"string","description":"Background style for the section","typeLabel":"SectionBackground","required":false},"spacing":{"type":"object","description":"Vertical spacing for the section","fields":{},"typeLabel":"SectionSpacing","required":false},"pattern":{"type":"object","description":"Optional background pattern name or URL","fields":{},"typeLabel":"PatternName","required":false},"patternOpacity":{"type":"number","description":"Pattern overlay opacity (0-1)","required":false},"patternClassName":{"type":"string","description":"Additional CSS classes for the pattern overlay","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"exampleProps":{"title":"Built-In Capabilities","description":"A full suite of tools included out of the box.","features":[{"iconName":"lucide/check-circle-2","title":"Auto-Scaling","description":"Automatically scales to handle any traffic spike."},{"iconName":"lucide/check-circle-2","title":"99.99% Uptime SLA","description":"Enterprise-grade reliability you can count on."},{"iconName":"lucide/check-circle-2","title":"24/7 Support","description":"Round-the-clock support from our expert team."},{"iconName":"lucide/check-circle-2","title":"Automated Backups","description":"Daily backups with one-click restore."},{"iconName":"lucide/check-circle-2","title":"Custom Domains","description":"Bring your own domain with free SSL."},{"iconName":"lucide/check-circle-2","title":"Team Management","description":"Role-based access control for your entire organization."}],"background":"default","spacing":"py-12 md:py-32"},"dependencies":["@opensite/ui"],"tags":["features","grid","icons","muted","five-column","capabilities","benefits"],"performance":{},"importantUsageNotes":"Use 'iconName' in format 'prefix/name' (e.g., 'lucide/check-circle-2'). No images. Supports optional 'href' on each item.","usageRequirements":{"requiredProps":[],"mediaSlots":{},"requiresSiteCapabilities":[],"propConstraints":{"features":{"minItems":3,"maxItems":9}}}}},"timestamp":"2026-06-27T20:13:31.523Z"}