@molecule/app-fonts-material-symbols
Provider bond · fonts · App (browser) · v1.0.3 · Apache-2.0
Material Symbols Outlined — local, self-hosted font (no external CDN)
npm install @molecule/app-fonts-material-symbolsnpm · Source on GitHub · Implements @molecule/app-fonts
How it works
@molecule/app-fonts-material-symbols is a provider bond on the app (browser) side: it implements the fonts core interface (@molecule/app-fonts) with a concrete vendor or library behind it.
Your code calls the core; you wire this provider once at startup. Swapping vendors later is one line in that wiring, not a rewrite.
import { setFont } from '@molecule/app-fonts'
import { font as icons } from '@molecule/app-fonts-material-symbols'
setFont(icons) // once, at app startup — before first paintWorks with: @molecule/app-fonts
Reference
Material Symbols Outlined font for molecule.dev.
Quick Start
import { setFont } from '@molecule/app-fonts'
import { font as icons } from '@molecule/app-fonts-material-symbols'
setFont(icons) // once, at app startup — before first paint
Glyphs render through the .material-symbols-outlined utility class
(injected by setFont() with the @font-face), using ligature names:
<span class="material-symbols-outlined">home</span>
Type
provider
Installation
npm install @molecule/app-fonts-material-symbols @molecule/app-fonts
API
Constants
font
Material Symbols Outlined font definition — local, self-hosted (no external CDN).
const font: FontDefinition
Core Interface
Implements @molecule/app-fonts interface.
Injection Notes
Requirements
Peer dependencies:
@molecule/app-fonts^1.0.1
Runtime Dependencies
@molecule/app-fonts