diff --git a/.changeset/grumpy-spies-flow.md b/.changeset/grumpy-spies-flow.md
new file mode 100644
index 0000000000..6ce80285ee
--- /dev/null
+++ b/.changeset/grumpy-spies-flow.md
@@ -0,0 +1,6 @@
+---
+"@navikt/ds-tokens": minor
+"@navikt/ds-css": minor
+---
+
+Fonts: Added built-in support for cyrillic, cyrillic-ext and latin-ext
diff --git a/@navikt/core/css/baseline/baseline.css b/@navikt/core/css/baseline/baseline.css
index 435bd3fb8a..47a15127bd 100644
--- a/@navikt/core/css/baseline/baseline.css
+++ b/@navikt/core/css/baseline/baseline.css
@@ -17,7 +17,7 @@
body,
:host {
- font-family: var(--a-font-family, "Source Sans Pro", Arial, sans-serif);
+ font-family: var(--a-font-family, "Source Sans 3", "Source Sans Pro", Arial, sans-serif);
line-height: 1.333;
font-size: 1.125rem;
}
diff --git a/@navikt/core/css/baseline/fonts.css b/@navikt/core/css/baseline/fonts.css
index f64ce1af4a..79b2773268 100755
--- a/@navikt/core/css/baseline/fonts.css
+++ b/@navikt/core/css/baseline/fonts.css
@@ -1,28 +1,129 @@
+/* cyrillic-ext */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: italic;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/italic-cyrillic-ext.woff2) format("woff2");
+ unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+/* cyrillic */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: italic;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/italic-cyrillic.woff2) format("woff2");
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* latin-ext */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: italic;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/italic-latin-ext.woff2) format("woff2");
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
+ U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* latin */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: italic;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/italic-latin.woff2) format("woff2");
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* cyrillic-ext */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: normal;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/normal-cyrillic-ext.woff2) format("woff2");
+ unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+/* cyrillic */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: normal;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/normal-cyrillic.woff2) format("woff2");
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* latin-ext */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: normal;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/normal-latin-ext.woff2) format("woff2");
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
+ U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* latin */
+@font-face {
+ font-family: "Source Sans 3";
+ font-style: normal;
+ font-weight: 400 600;
+ font-display: swap;
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/normal-latin.woff2) format("woff2");
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* Legacy support */
+
+/* latin-ext */
@font-face {
font-family: "Source Sans Pro";
font-style: italic;
- font-weight: 400;
+ font-weight: 400 600;
font-display: swap;
- src: url("https://cdn.nav.no/aksel/fonts/SourceSans3-italic.woff2") format("woff2");
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/italic-latin-ext.woff2) format("woff2");
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
+ U+2C60-2C7F, U+A720-A7FF;
}
+
+/* latin */
@font-face {
font-family: "Source Sans Pro";
font-style: italic;
- font-weight: 600;
+ font-weight: 400 600;
font-display: swap;
- src: url("https://cdn.nav.no/aksel/fonts/SourceSans3-italic-latin-semibold.woff2") format("woff2");
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/italic-latin.woff2) format("woff2");
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
+
+/* latin-ext */
@font-face {
font-family: "Source Sans Pro";
font-style: normal;
- font-weight: 400;
+ font-weight: 400 600;
font-display: swap;
- src: url("https://cdn.nav.no/aksel/fonts/SourceSans3-normal.woff2") format("woff2");
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/normal-latin-ext.woff2) format("woff2");
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
+ U+2C60-2C7F, U+A720-A7FF;
}
+
+/* latin */
@font-face {
font-family: "Source Sans Pro";
font-style: normal;
- font-weight: 600;
+ font-weight: 400 600;
font-display: swap;
- src: url("https://cdn.nav.no/aksel/fonts/SourceSans3-normal.woff2") format("woff2");
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3/normal-latin.woff2) format("woff2");
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
diff --git a/@navikt/core/react/src/typography/stories/font.stories.tsx b/@navikt/core/react/src/typography/stories/font.stories.tsx
index 61d4f62c78..c8cc4c1669 100644
--- a/@navikt/core/react/src/typography/stories/font.stories.tsx
+++ b/@navikt/core/react/src/typography/stories/font.stories.tsx
@@ -118,6 +118,9 @@ export const Cyrillic: Story = {
cyrillic: true,
showDefault: false,
},
+ parameters: {
+ chromatic: { disable: true },
+ },
};
export const Samisk: Story = {
@@ -127,6 +130,9 @@ export const Samisk: Story = {
samisk: true,
showDefault: false,
},
+ parameters: {
+ chromatic: { disable: true },
+ },
};
export const Mixed: Story = {
@@ -136,15 +142,15 @@ export const Mixed: Story = {
showDefault: false,
mixed: true,
},
+ parameters: {
+ chromatic: { disable: true },
+ },
};
export const FontWeight: Story = {
render: () => {
return (
<>
- {fontWeights.map((weight) => (
-