Circular Pro in Kiwi.com projects

Circular Pro in non-Kiwi.com projects

Using Orbit with Circular Pro

In React components

1. Insert font files into the page

<link rel="stylesheet" href="//images.kiwi.com/fonts/circular-pro/style.min.css" />

2. Change theme object

import React from "react"
import getTokens from "@kiwicom/orbit-components/lib/getTokens"
import OrbitProvider from "@kiwicom/orbit-components/lib/OrbitProvider"
const customTokens = getTokens({
base: {
fontFamily: `"Circular Pro", -apple-system, ".SFNSText-Regular", "San Francisco",
"Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;`
<OrbitProvider useId={React.useId} theme={{orbit: customTokens}}>
<App />

In Figma