ezIcon Help

# 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

1. Select a Base: Use the Left Sidebar to choose between a Standard Icon, Custom Text, AI-Generated Asset, or Uploaded Image.
2. 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.
3. Refine the Icon: Adjust size, color, and position offsets.
4. 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.