Skip to content

feat(fonts): local inference #11619

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
May 7, 2025
Merged

feat(fonts): local inference #11619

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d69f18b
feat: clarify unicodeRange
florian-lefebvre May 6, 2025
41b740b
feat(fonts): local inference
florian-lefebvre May 6, 2025
1af190a
Update src/content/docs/en/reference/experimental-flags/fonts.mdx
florian-lefebvre May 7, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 11 additions & 3 deletions src/content/docs/en/reference/experimental-flags/fonts.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -442,7 +442,9 @@ display: "block"
**Default:** `undefined`
</p>

Determines the specific [range of unicode characters](https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/unicode-range) to be used from a font:
Determines when a font must be downloaded and used based on a specific [range of unicode characters](https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/unicode-range). If a character on the page matches the configured range, the browser will download the font and all characters will be available for use on the page. To configure a subset of characters preloaded for a single font, see the [subsets](#subsets) property instead.

This can be useful for localization to avoid unnecessary font downloads when a specific part of your website uses a different alphabet and will be displayed with a separate font. For example, a website that offers both English and Japanese versions can prevent the browser from downloading the Japanese font on English versions of the page that do not contain any of the Japanese characters provided in `unicodeRange`.

```js
unicodeRange: ["U+26"]
Expand Down Expand Up @@ -533,7 +535,8 @@ export default defineConfig({

<p>

**Type:** `number | string`
**Type:** `number | string`<br />
**Default:** `undefined`
</p>

A [font weight](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight):
Expand All @@ -548,11 +551,14 @@ If the associated font is a [variable font](https://developer.mozilla.org/en-US/
weight: "100 900"
```

If left undefined, Astro will try to infer the value based on the first [`source`](#src).

#### style

<p>

**Type:** `"normal" | "italic" | "oblique"`
**Type:** `"normal" | "italic" | "oblique"`<br />
**Default:** `undefined`
</p>

A [font style](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style):
Expand All @@ -561,6 +567,8 @@ A [font style](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style):
style: "normal"
```

If left undefined, Astro will try to infer the value based on the first [`source`](#src).

#### src

<p>
Expand Down