Auric Artisan Font Hub

Find your voice. Give it type.

A typography workspace for Visual Studio Code: discover a family, compare its details and add it to your project from fonts.auricartisan.com.

2,023 library families · 547 variable families · Offline metadata · No account required

Explore fonts online · Get support

Start here

Install Auric Artisan Font Hub in VS Code 1.85 or newer.
Open Auric Font Hub in the Activity Bar, or run Auric Artisan Font Hub: Open Font Hub.
Search for a family and open its specimen to inspect styles, glyphs and license.
Open a source file, then choose Preview on a font card.
Review the native VS Code diff. Choose Apply to add the CDN setup, or Cancel to keep your file unchanged. Apply leaves the file unsaved, with Undo available.

The compact sidebar and full studio share the same Auric logo, charcoal-and-gold layout, custom dropdowns, keyboard controls and colour picker. Use Open studio in the sidebar when you want more room.

Keyboard shortcuts

Action	Windows / Linux	macOS
Open Font Hub	Ctrl+Alt+F	Cmd+Alt+F
Quick Pick font	Ctrl+Alt+T	Cmd+Alt+T

The editor context menu groups font commands under Auric Fonts.

Add a font intelligently

Add to code uses the default Automatic mode. It adds a CDN stylesheet and a reusable class such as .auric-font-inter. It does not replace selected text, change your existing design or apply a font to the entire page.

Source file	Automatic action
HTML with a `<head>`	Adds the stylesheet link and a small class rule inside the head
CSS, SCSS, Less, PostCSS	Adds `@import` before normal rules, preserving charset and Sass module directives; appends the class rule
JavaScript / TypeScript	Appends browser-guarded stylesheet/class setup; does nothing during server-side execution
JSX, TSX, Vue, Svelte, Astro, data files and other languages	Copies an HTML embed for explicit placement in your framework layout or global stylesheet
No writable editor	Copies the CDN embed

For example, after adding Inter to an HTML page:

<p class="auric-font-inter">A considered choice of type.</p>

Repeated automatic insertion does not duplicate the generated setup. Preview application checks that the original document has not changed. Smart insertion is limited to 2 MiB documents and is conservative rather than a complete HTML/CSS/JavaScript parser.

The selected-family tray can add up to 12 families together. Existing content is preserved, and each family gets its own class.

For manual control, the inspector offers HTML links, CSS imports, font-family declarations, @font-face, the AuricFonts loader, Tailwind configuration, SCSS variables, design tokens and family names. Explicit formats insert at the cursor or selections; they do not automatically merge framework configuration files. Copying a family declaration or Tailwind entry alone does not load the font.

Explore the details

Search family, designer, scripts, OpenType features and licensing metadata.
Filter by category, weights, variable/italic/monospace properties, source and license.
Edit specimen text, preview size and card density.
Inspect specimen, waterfall, suitability, pairings, features, glyphs, charset, available styles, source metadata and license details.
Try variable axes and OpenType controls where supported by the preview face.
Compare up to four families; save favorites and return to recent choices.
Rank recommendations by design intent, industry, colour palette and local use.
Use the shared colour picker for palette editing, contrast checks, ramps and history.

Suitability and accessibility scores are catalog heuristics, not guarantees. Check your real text, language coverage, size and contrast in the finished product. System-font metadata is hidden by default because those fonts may not be installed on your computer.

Your CDN, clearly defined

Font embeds point to https://fonts.auricartisan.com/css/<family-id>.css. The extension does not substitute Google Fonts or another CDN.

Browsing metadata works offline. Previews fetch font files through the extension host, validate their origin and use a local cache. The webview itself cannot make network requests. Opening the studio creates no files in your project. Inserting a font edits only the chosen document; no local loader file is required.

Check browser delivery

Run Check Font CDN and Browser CORS, or use Check CDN health in the studio. The report checks the catalog, a family stylesheet and its preview font with bounded HEAD requests, using http://localhost:5500 as a test origin. It is a sample check, not a complete audit of every family or deployment origin.

If previews work in VS Code but your website shows a fallback font, inspect browser network errors. The CDN must allow cross-origin font requests. A public, credential-free font CDN can return:

Access-Control-Allow-Origin: *

For a restricted CDN, allow your exact website and development origins instead. Serve correct content types and allow the CDN in your application's font/style Content Security Policy. Inline class rules may need moving into your permitted stylesheet under a strict CSP.

If the domain is backed by Cloudflare R2, configure the bucket's CORS policy. Changes may also require a custom-domain cache purge. Follow Cloudflare's CORS setup guide. Font Hub diagnoses the response; it cannot change your hosting configuration or bypass browser security.

Offline use and self-hosting

The bundled snapshot includes details and license notices. Previously cached previews remain available when possible; uncached font files need network access. You can disable requests through auricFontLib.network.enabled.

Download self-hosting kit is an explicit save action. Eligible fonts are exported with CSS, a demo, README and required notices. Downloads fail closed when redistribution permission or a required license notice cannot be established. System fonts are not exported. Each font retains its own license; the extension's license does not grant rights to every font.

Settings and privacy

Open Font Hub's settings button for insertion format, specimen defaults, density, catalog refresh, cache limits and download limits. Command IDs and settings retain the auricFontLib prefix for compatibility.

Search queries, source code, favorites and usage history are not uploaded. The CDN still receives ordinary network information needed to serve requested assets, including the requesting IP. There is no analytics integration or account.

Moving from Font Library

This is Font Hub 0.1.0, extension ID auric-artisan.auric-artisan-font-hub. The old Font Library package has a different identity. Disable or uninstall it before enabling Font Hub to avoid duplicate commands and views. Existing auricFontLib.* settings continue to apply; favorites, recents and cached files stored under the old extension are not automatically migrated.

The source folder remains Auric-Artisan-Font-Lib to preserve repository tooling.

Troubleshooting

Fonts are not visible: check CDN health, network settings and the browser's font requests. A successful stylesheet response alone is not enough.
Nothing changed after Insert: the setup may already exist, or the file type requires manual placement. Check the notification or clipboard.
Preview became stale: reopen Preview after editing the source.
An embed is present but text is unchanged: apply its generated CSS class, or use the family declaration in your own selector.
Catalog refresh is rejected: the bundled snapshot stays available. Remote identities and license data are validated; new families may require an extension update.

For help, use Auric Artisan support and include your extension version, file language and a redacted error message.