UI Icons Paragraphs

Choose an icon for each paragraph type from any icon pack with the UI Icons picker, instead of uploading an image file. It appears in the paragraph type list and in the Paragraphs editing widget.

The Paragraphs module lets you give each paragraph type an icon, but only as an uploaded image file. UI Icons Paragraphs replaces that upload with the icon picker from UI Icons. You browse and search the icon packs already on your site (for example from your theme, a design system or Iconify), click an icon, and it is used wherever Paragraphs shows the type's icon.

Features

• Icon picker on the paragraph type form: a searchable, visual picker right below the existing "Paragraph type icon" upload, including the per-pack settings the icon pack offers (such as size or color)
• Works with any icon pack: uses the Drupal core Icon API, so any pack defined in a module or theme *.icons.yml file is available (SVG files, SVG sprites, fonts, Iconify, and so on)
• Shown everywhere Paragraphs shows type icons:
  • the paragraph types overview (Structure » Paragraph types)
  • the header of each paragraph in the editing widget
  • the buttons of the "Add paragraph" modal dialog
• Takes precedence over uploaded icons: when a type has both, the selected icon is used. Types without one keep their uploaded image, so you can switch over one type at a time
• Stored in configuration: the icon is saved as a third-party setting on the paragraph type, so it is exported and deployed with your config and can be set from recipes

Use this module when your site already has an icon set (for example from a design system or your admin theme) and you want paragraph types to use those icons consistently, without keeping separate image files for each type.

Post-Installation

1. Make sure at least one icon pack is available. It can be provided by your theme, by a module, or by a contributed project
2. Go to Structure » Paragraph types and edit a paragraph type
3. Under Paragraph type UI icon, click the field to open the picker, then select an icon. Optionally adjust the icon settings
4. Save. The icon now shows in the paragraph types list and in the Paragraphs widget on your content forms