Alpine.js

Devicons for Alpine.js — an x-dev-icon directive and $devIcon magic with tree-shakeable icon data. 578 icons in original, plain, line, and their -wordmark variants.

Install

pnpm add @devicons-pack/alpine

Usage

import Alpine from 'alpinejs';
import devIcon, {register} from '@devicons-pack/alpine';
import {Javascript} from '@devicons-pack/alpine/original';

register(Javascript);
Alpine.plugin(devIcon);
Alpine.start();

<span x-dev-icon="'javascript'"></span>
<span x-dev-icon="{name: 'javascript', style: 'plain-wordmark', label: 'Javascript'}"></span>
<span x-data x-html="$devIcon('javascript', 'original')"></span>

Only registered icons end up in your bundle. Without label the svg is aria-hidden.