Icons in AI Website Creator
Replace individual icons, search icon packs, upload custom assets and manage icon style and color in AI Website Creator.
Use the icon panel to replace a content icon without rebuilding its section. Choose a library icon or upload an asset, then manage the selected icon's color separately from the site's automatic icon style.
At a Glance
| Control | What it changes | Scope |
|---|---|---|
| Icon Pack | Searches and selects library icons | Selected icon |
| Uploads | Selects uploaded custom icons | Selected icon |
| Site icon style | Outline or Filled for automatically matched content icons | Site-wide |
| Color | Auto, palette colors or Custom… | Selected recolorable icon |
Replace an Icon
Select the icon
Click a content icon on the canvas. The Icon panel opens. An icon previously replaced with a raster image still opens the icon panel rather than the ordinary image panel.
Find a replacement
Under Content, use Icon Pack to search for a meaningful subject. Choose an icon pack and style filter to narrow the results, then select the replacement.
Review the section
Check the icon next to its heading and surrounding icons. Prefer consistent visual weight. The replacement is keyed to the selected icon instance rather than every matching icon in its row.
Icon Packs and Search Filters
The pack picker offers All Icon Packs, Lucide, Tabler, Solar, Heroicons, Phosphor, Material Design, Remix Icon, Myna UI, IconaMoon and Huge Icons.
The result-style filter offers All Styles, Filled and Outline. These filters help you find a replacement; they are not the same as the site-wide style control. Search for concepts such as calendar, shield or delivery rather than long instructions.
Site Icon Style
Site icon style switches automatically matched content icons between Outline and Filled across the site. Its initial style is Outline when no saved choice exists. Icons you have deliberately hand-picked are not replaced by this site-wide switch.
Use this control for a consistent automatic icon treatment. Use the pack search when one particular icon should communicate a different idea.
Selected Icon Color
Color appears for an icon that can be recolored, such as a compatible inline SVG. Auto lets the icon follow its section's inherited color. Choose a project palette color or Custom… to give that selected icon an explicit color. Return to Auto to restore inheritance.
A raster icon, such as an uploaded PNG, cannot be recolored through the SVG color control. The Color row is hidden when it cannot affect the selected asset.
Upload a Custom Icon
Use Uploads for your own icon assets. Select the uploaded thumbnail to use it in the chosen slot. A custom SVG can participate in the icon color workflow when it is normalized for recoloring; a raster asset keeps its own pixels and colors.
Do not confuse a custom icon with the site logo. Navbar and footer brand logos use the dedicated Logo control.