Skip to content

Conversation

kev2block
Copy link

This PR adds a new plugin: Font Customizer.

Features

  • Two modes:
    • Simple: set one global font for the entire app.
    • Advanced: set per-scope fonts: Title, Artist, Lyrics.
  • Uses Google Fonts on demand (no manual CSS needed).
  • Applies instantly via CSS variables; no reload required.
  • Clean defaults (all “System Default”).

Screenshots

Playlist view

playlist

Lyrics view

lyrics

Implementation

  • src/plugins/font-customizer/index.ts — plugin registration, defaults.
  • src/plugins/font-customizer/menu.ts — menu UI (mode + popular font radio lists).
  • src/plugins/font-customizer/renderer.ts — loads Google Fonts, sets CSS vars, applies to player/lyrics surfaces.
  • src/plugins/font-customizer/types.tsFontCustomizerConfig, FontMode, popularFonts.

Tested

  • Windows 11, Node v22.18.0, pnpm v10.15.0
  • Dev (pnpm dev) and packaged builds.

Note: You could add custom fonts via plain CSS (@font-face) in a user stylesheet,
but this plugin is simpler: it fetches Google Fonts automatically and scopes them
reliably without manual CSS maintenance.

No changes to existing plugins or core behavior.

@ArjixWasTaken
Copy link
Member

Not quite, look at other plugins for how they apply stylesheets.

@JellyBrick JellyBrick added the enhancement New feature or request label Sep 5, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants