Getting Started User Guide

🎨 EzIcon Generator - User Guide

Welcome to EzIcon Generator, a professional-grade tool designed to help you create high-quality icons for apps, websites, and presentations in seconds.

🚀 Quick Start

Select a Base: Use the Left Sidebar to choose between a Standard Icon, Custom Text, AI-Generated Asset, or Uploaded Image.
Style your Background: Use the Right Sidebar to set gradients, solid colors, or transparency. Adjust the border radius for a "Squircle" (iOS style) or a sharp square.
Refine the Icon: Adjust size, color, and position offsets.
Export: Click "Download Icon" to save a single image or use the Export Modal for bulk sizes.

🔍 The "Magic" Search Feature

One of the most powerful features of EzIcon is the Seamless Search.

Known Names: If you know the exact name of a Google Material Symbol (e.g., rocket_launch) or a Font Awesome icon (e.g., fa-ghost), simply type it into the search bar.
Dynamic Loading: Even if the icon isn't in the preview grid, the app will generate a "Magic Tile" (marked with a wand icon). Selecting this will pull the icon directly from the library's official database.

✍️ Text Icons

Switch to Text Mode (Type icon) to create typography-based logos.

Font Library: Choose from dozens of curated fonts, from professional Sans-Serifs to elegant Cursive styles.
Single Characters: Perfect for "Lettermark" logos or initials.

🤖 AI Generation & Refining

Turn your ideas into assets using the AI Generator (Sparkles icon).

Icon Mode: Generates high-contrast silhouettes that inherit your chosen icon color.
Photo Mode: Generates vibrant, full-color assets.
Modify Current: If you like the shape but want a change, use "Modify Current" to refine the existing image with a new prompt while keeping the same layout.
Alpha Protection: In Photo mode, the app attempts to automatically remove backgrounds so your asset sits cleanly on your chosen gradient.

🎨 Professional Styling

Fill Styles: Toggle between Solid, Linear, and Radial gradients.
Effects:Radial Glare: Adds a subtle "glassy" highlight to the top-left corner.
Noise Texture: Adds a premium "grain" effect to the background for depth.
Stroke: Add a border to your icon with adjustable opacity.
Background Shadow: Toggle Enable Shadow to on position. Optionally toggle the 3D Shadow to the On position to create a 3D filled style shadow. Use the X and Y offsets to perfectly position your shadow. Select a shadow color, then adjust the Opacity and Blur setting to further refine your icon style.
Transformation: Use the X and Y offsets to perfectly center icons that might look visually "heavy" on one side.

💾 Project Management

Save Project: Button located at the bottom of the Right Sidebar. This saves a small .json file containing all your project/style settings.
Requires Professional Edition
Open Project: Open a previously saved project/style file .json file to pick up exactly where you left off.
Requires Professional Edition
Bulk Export: The download modal allows you to specify multiple sizes (e.g., 16px, 128px, 1024px) and formats (PNG/SVG) to be exported simultaneously in a .zip bundle. In the Professional Edition, the .zip file will also include the project file settings you used used to style the images.

💡 Pro Tips

SVG vs PNG: Use SVG for web development to keep file sizes tiny and icons sharp at any scale. Use PNG for app stores and presentations.
Noise Opacity: Keeping Noise around 15-25% provides a modern, high-end feel without being distracting.
Drop Files: You can drag and drop any SVG or PNG directly onto the preview area to instantly use it as your icon asset.
Font Icon styling with AI: You can prompt AI to change any Material Symbols and Font Awesome symbol, etc. into a custom one color icon.