Open Icons for ACF (Lite)

Open Icons for ACF (Lite) adds a custom field type to Advanced Custom Fields (ACF) that lets you select and display SVG icons from the Heroicons library. All 324 icons are bundled with the plugin — no external downloads required.

Features:

• 324 Heroicons – Beautiful, hand-crafted SVG icons by the makers of Tailwind CSS
• Color palette – Define up to 3 color tokens and apply them to icons
• Bundled locally – All icons are included in the plugin, no external requests needed
• Clean output – Simple get_openicon() helper function for displaying icons
• Sanitised SVGs – All icons are sanitised for security

How it works:

1. Add an “Open Icons” field to your ACF field group
2. Select an icon and color from the beautiful picker interface
3. Display the icon in your theme using the get_openicon() function

Display icons in your theme:

php
<?php
$icon = get_field('your_icon_field');
get_openicon($icon, ['size' => 24, 'class' => 'my-icon']);
?>

Want more icons?

Open Icons for ACF Premium unlocks:

• Lucide Icons – 1,500+ icons
• Tabler Icons – 5,200+ icons
• Icon migration tools when switching providers
• Priority support

Development

The src/ directory contains the uncompiled React/TypeScript source code for the admin UI components.

Source code is available on GitHub:
https://github.com/davidosull/open-icons-acf-lite.git

To build from source:

1. Clone the repository
2. Run npm install
3. Run npm run build

This will bundle the Heroicons SVGs into assets/icons/ and compile the TypeScript/React source into assets/build/.