> ## Documentation Index
> Fetch the complete documentation index at: https://veryfront.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# veryfront/fonts

> Load Google Fonts as a React component.

## Import

```ts theme={null}
import { GoogleFonts } from "veryfront/fonts";
```

## Examples

```tsx theme={null}
import { GoogleFonts } from "veryfront/fonts";

<GoogleFonts
  fonts={[
    { name: "Inter", weights: [400, 500, 700], variable: "--font-inter" },
    { name: "Fira Code", weights: [400], variable: "--font-mono" },
  ]}
/>
```

## Exports

### Components

| Name          | Description          | Source                                                                                       |
| ------------- | -------------------- | -------------------------------------------------------------------------------------------- |
| `GoogleFonts` | Render Google fonts. | [source](https://github.com/veryfront/veryfront-code/blob/main/src/react/fonts/index.ts#L88) |

### Types

| Name               | Description                     | Source                                                                                       |
| ------------------ | ------------------------------- | -------------------------------------------------------------------------------------------- |
| `Font`             | Public API contract for font.   | [source](https://github.com/veryfront/veryfront-code/blob/main/src/react/fonts/index.ts#L23) |
| `GoogleFontsProps` | Props accepted by Google fonts. | [source](https://github.com/veryfront/veryfront-code/blob/main/src/react/fonts/index.ts#L31) |
