Skip to content

Latest commit

 

History

History
70 lines (47 loc) · 2.91 KB

readme-graphic-design.md

File metadata and controls

70 lines (47 loc) · 2.91 KB

Graphic design

Guidelines and resources

AI Icon Generators

Several AI-powered icon generators can help you create professional-looking app icons in minutes:

  • Iconik AI: $2/75 icons; only icons, free credits, real easy to start
  • Appicons.ai: $10/m (monthly?) ~100 icons; only icons
  • Stockimg.ai: $84/y unlimited image credits; logos, stock photos, illustration and more

Post-processing

Use Inkscape to convert generated icon to vector.

A good intro video on quick tracing a raster image (the magic of Ctrl-L shortcut).

Export the icon in different sizes using App Icon Generator plugin.

For Web/PWA:

Additional resources

Quick Guide

Here's a simple process to create your app icon:

  1. Choose an AI icon generator
  2. Describe your desired icon, including style, colors, and any specific elements
  3. Generate multiple options using the AI tool
  4. Select the best-generated icon
  5. Use the platform's built-in editor or export to a tool like Photopea for fine-tuning
  6. Ensure your icon looks good at various sizes, as it will be displayed differently across devices, particularly tiny ones like 29x29px
  7. Export your icon in the required formats and sizes for your target platforms (iOS, Android, etc.)

Important Tips

  • Keep it simple - a complex icon will look cluttered at small sizes
  • Test your icon at multiple sizes (particularly tiny ones like 29x29px)
  • Ensure good contrast so it's visible on both light and dark backgrounds
  • Avoid text unless absolutely necessary
  • Consider your competition's icons to stand out while fitting the category

Online design tools

Alternatively you can use the following online tools:

  • Figma: free, web-based, industry standard
  • Canva: very beginner-friendly

Online image editors

After generating your icon, you may want to make some adjustments:

  • Photopea: Appicons.ai offers integration with Photopea, a free online alternative to Photoshop, for editing your generated icons.
  • Fotor: This platform provides an AI icon generator with built-in customization options.