Skip to content
SVG Sprite Maker

SVG Sprite Maker

by sorieil

SVG Sprite and TypeScript Enum Generator

FreeFigma

Installs

61

Likes

9

Users

844

Views

1,423

Preview

SVG Sprite Maker preview

About this plugin

DescriptionThe SVG Sprite and TypeScript Enum Generator plugin for Figma helps streamline your workflow by automating the process of converting SVG icons into a single sprite sheet and generating corresponding TypeScript enum code. This plugin is designed for developers and designers who want to optimize their projects with efficient SVG handling and seamless TypeScript integration.FeaturesSVG Sprite Generation: Automatically compile multiple SVG icons into a single sprite sheet.TypeScript Enum Generation: Generate TypeScript enum code corresponding to the SVG icons for easy reference in your codebase.User-friendly Interface: Intuitive and easy-to-use interface for quick and efficient sprite and enum generation.How to use// SVGIcons.tsxtype SVGIconProps = {icon: SVGIconswidth: numberheight: numberactive: boolean}/*** Renders an SVG icon.* The SVGSprite.tsx file must be declared at the top level of the project page.* @param {SVGIcons} props.icon - The name of the icon to render.* @param {number} props.width - The width of the SVG element.* @param {number} props.height - The height of the SVG element.* @returns {JSX.Element} The rendered SVG icon.*/const SVGIcon = ({icon,width,height,...rest // Rest operator to capture additional props}: Partial): JSX.Element => {return ()}export default SVGIcon// SVGSprite.tsxexport enum SVGIcons {SAMPLE_ICON = 'sample_icon',}const SVGSprite = () => {return ()}export default SVGSprite// use// Before using the component, you must first call the component in the global scope.

More software development plugins

View all