{
    "componentChunkName": "component---src-templates-icon-template-tsx",
    "path": "/theming/icons/custom-icons/",
    "result": {"data":{"iconsExamples":{"nodes":[{"examples":["export const PayIcon = (props) => {\n return (\n     <svg width=\"24px\" height=\"24px\" viewBox=\"0 0 24 24\" version=\"1.1\">\n     ...\n     </svg>\n );\n}\n\nexport const PayIconActive = (props) => {\n return (\n     <svg width=\"24px\" height=\"24px\" viewBox=\"0 0 24 24\" version=\"1.1\">\n         ...\n     </svg>\n );\n}\n\n// Then use the icon module.\n<PaymentTab\n key=\"payment-tab\"\n icon={<PayIcon />}\n iconActive={<PayIconActive />}\n/>"],"description":"<p>You can also create your own custom icons using SVG files. First, create a custom module using the SVG(s) you would like to use.</p>","docName":"Custom Icons"}]}},"pageContext":{"name":"custom-icons"}},
    "staticQueryHashes": ["2573139180","3167116022","426031883"]}