@openkfw/design-tokens 0.2.1 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/output/README.md +1 -1
- package/output/figma/kfw-design-tokens.light.json +1 -1
- package/output/json/kfw-design-tokens.light.json +6 -6
- package/output/penpot/kfw-design-tokens.light.json +1 -1
- package/output/web_next_16px/css/kfw-design-tokens.light.css +4 -4
- package/output/web_next_16px/js/kfw-design-tokens.light.d.ts +2 -2
- package/output/web_next_16px/js/kfw-design-tokens.light.js +4 -4
- package/output/web_next_16px/scss/kfw-design-tokens.light.scss +4 -4
- package/output/web_stable_10px/css/kfw-design-tokens.light.css +4 -4
- package/output/web_stable_10px/js/kfw-design-tokens.light.d.ts +2 -2
- package/output/web_stable_10px/js/kfw-design-tokens.light.js +4 -4
- package/output/web_stable_10px/scss/kfw-design-tokens.light.scss +4 -4
- package/package.json +2 -2
- package/tokens/gen-tokens.dark.json5 +1 -1
- package/tokens/tokens.json +1 -1
package/output/README.md
CHANGED
|
@@ -21,4 +21,4 @@ In the `/output` directory, you will find all available output formats for Figma
|
|
|
21
21
|
|
|
22
22
|
- `/web_next_16px`: Use this folder for third-party systems where we cannot influence the REM root value and it corresponds to the standard browser font size of 16px (100%)
|
|
23
23
|
|
|
24
|
-
Note: A font size of 10px should never be used. Therefore, it is advisable to set the font size in the `<body>` to 1.6rem.
|
|
24
|
+
Note: A font size of 10px should never be used. Therefore, it is advisable to set the font size in the `<html>` to `62.5%` and `<body>` to `1.6rem` (16px).
|
|
@@ -7074,8 +7074,8 @@
|
|
|
7074
7074
|
"default"
|
|
7075
7075
|
]
|
|
7076
7076
|
},
|
|
7077
|
-
"
|
|
7078
|
-
"key": "{semantic.fontweight.
|
|
7077
|
+
"bold": {
|
|
7078
|
+
"key": "{semantic.fontweight.bold}",
|
|
7079
7079
|
"$value": 500,
|
|
7080
7080
|
"filePath": "tokens/tokens.json",
|
|
7081
7081
|
"isSource": true,
|
|
@@ -7083,18 +7083,18 @@
|
|
|
7083
7083
|
"original": {
|
|
7084
7084
|
"$value": "{base.fontweight.medium}",
|
|
7085
7085
|
"$type": "fontWeight",
|
|
7086
|
-
"key": "{semantic.fontweight.
|
|
7086
|
+
"key": "{semantic.fontweight.bold}"
|
|
7087
7087
|
},
|
|
7088
|
-
"name": "kfw-fontweight-
|
|
7088
|
+
"name": "kfw-fontweight-bold",
|
|
7089
7089
|
"attributes": {
|
|
7090
7090
|
"category": "semantic",
|
|
7091
7091
|
"type": "fontweight",
|
|
7092
|
-
"item": "
|
|
7092
|
+
"item": "bold"
|
|
7093
7093
|
},
|
|
7094
7094
|
"path": [
|
|
7095
7095
|
"semantic",
|
|
7096
7096
|
"fontweight",
|
|
7097
|
-
"
|
|
7097
|
+
"bold"
|
|
7098
7098
|
]
|
|
7099
7099
|
}
|
|
7100
7100
|
},
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* KfW Design Tokens v0.
|
|
2
|
+
* KfW Design Tokens v0.3.0
|
|
3
3
|
* Copyright 2025
|
|
4
4
|
* Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
*/
|
|
@@ -126,9 +126,9 @@
|
|
|
126
126
|
--kfw-base-borderwidth-lg: 0.125rem;
|
|
127
127
|
--kfw-base-fontweight-regular: 400;
|
|
128
128
|
--kfw-base-fontweight-medium: 500;
|
|
129
|
-
--kfw-base-letterspacing-tight: -0.
|
|
129
|
+
--kfw-base-letterspacing-tight: -0.5px;
|
|
130
130
|
--kfw-base-letterspacing-normal: 0;
|
|
131
|
-
--kfw-base-letterspacing-wide: 0.
|
|
131
|
+
--kfw-base-letterspacing-wide: 0.5px;
|
|
132
132
|
--kfw-base-letterspacing-wider: 1px;
|
|
133
133
|
--kfw-base-layout-breakpoint-xs: 20rem;
|
|
134
134
|
--kfw-base-layout-breakpoint-sm: 37.5rem;
|
|
@@ -249,7 +249,7 @@
|
|
|
249
249
|
--kfw-focusring-outline-offset: 0.125rem;
|
|
250
250
|
--kfw-focusring-outline-style: dashed;
|
|
251
251
|
--kfw-fontweight: 400;
|
|
252
|
-
--kfw-fontweight-
|
|
252
|
+
--kfw-fontweight-bold: 500;
|
|
253
253
|
--kfw-breakpoint-mobile: 37.5rem;
|
|
254
254
|
--kfw-breakpoint-tablet: 52.5rem;
|
|
255
255
|
--kfw-breakpoint-desktop: 60rem;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* KfW Design Tokens v0.
|
|
2
|
+
* KfW Design Tokens v0.3.0
|
|
3
3
|
* Copyright 2025
|
|
4
4
|
* Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
*/
|
|
@@ -540,7 +540,7 @@ export const KfwFocusringOutlineWidth: string;
|
|
|
540
540
|
export const KfwFocusringOutlineOffset: string;
|
|
541
541
|
export const KfwFocusringOutlineStyle: string;
|
|
542
542
|
export const KfwFontweight: number;
|
|
543
|
-
export const
|
|
543
|
+
export const KfwFontweightBold: number;
|
|
544
544
|
export const KfwBreakpointMobile: string;
|
|
545
545
|
export const KfwBreakpointTablet: string;
|
|
546
546
|
export const KfwBreakpointDesktop: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* KfW Design Tokens v0.
|
|
2
|
+
* KfW Design Tokens v0.3.0
|
|
3
3
|
* Copyright 2025
|
|
4
4
|
* Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
*/
|
|
@@ -242,9 +242,9 @@ export const KfwBaseBorderwidthMd = "1px";
|
|
|
242
242
|
export const KfwBaseBorderwidthLg = "0.125rem";
|
|
243
243
|
export const KfwBaseFontweightRegular = 400;
|
|
244
244
|
export const KfwBaseFontweightMedium = 500;
|
|
245
|
-
export const KfwBaseLetterspacingTight = "-0.
|
|
245
|
+
export const KfwBaseLetterspacingTight = "-0.5px";
|
|
246
246
|
export const KfwBaseLetterspacingNormal = "0";
|
|
247
|
-
export const KfwBaseLetterspacingWide = "0.
|
|
247
|
+
export const KfwBaseLetterspacingWide = "0.5px";
|
|
248
248
|
export const KfwBaseLetterspacingWider = "1px";
|
|
249
249
|
export const KfwBaseLayoutBreakpointXs = "20rem";
|
|
250
250
|
export const KfwBaseLayoutBreakpointSm = "37.5rem";
|
|
@@ -544,7 +544,7 @@ export const KfwFocusringOutlineWidth = "0.125rem";
|
|
|
544
544
|
export const KfwFocusringOutlineOffset = "0.125rem";
|
|
545
545
|
export const KfwFocusringOutlineStyle = "dashed";
|
|
546
546
|
export const KfwFontweight = 400;
|
|
547
|
-
export const
|
|
547
|
+
export const KfwFontweightBold = 500;
|
|
548
548
|
export const KfwBreakpointMobile = "37.5rem";
|
|
549
549
|
export const KfwBreakpointTablet = "52.5rem";
|
|
550
550
|
export const KfwBreakpointDesktop = "60rem";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
// KfW Design Tokens v0.
|
|
2
|
+
// KfW Design Tokens v0.3.0
|
|
3
3
|
// Copyright 2025
|
|
4
4
|
// Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
|
|
@@ -122,9 +122,9 @@ $kfw-base-borderwidth-md: 1px;
|
|
|
122
122
|
$kfw-base-borderwidth-lg: 0.125rem;
|
|
123
123
|
$kfw-base-fontweight-regular: 400;
|
|
124
124
|
$kfw-base-fontweight-medium: 500;
|
|
125
|
-
$kfw-base-letterspacing-tight: -0.
|
|
125
|
+
$kfw-base-letterspacing-tight: -0.5px;
|
|
126
126
|
$kfw-base-letterspacing-normal: 0;
|
|
127
|
-
$kfw-base-letterspacing-wide: 0.
|
|
127
|
+
$kfw-base-letterspacing-wide: 0.5px;
|
|
128
128
|
$kfw-base-letterspacing-wider: 1px;
|
|
129
129
|
$kfw-base-layout-breakpoint-xs: 20rem;
|
|
130
130
|
$kfw-base-layout-breakpoint-sm: 37.5rem;
|
|
@@ -245,7 +245,7 @@ $kfw-focusring-outline-width: 0.125rem;
|
|
|
245
245
|
$kfw-focusring-outline-offset: 0.125rem;
|
|
246
246
|
$kfw-focusring-outline-style: dashed;
|
|
247
247
|
$kfw-fontweight: 400;
|
|
248
|
-
$kfw-fontweight-
|
|
248
|
+
$kfw-fontweight-bold: 500;
|
|
249
249
|
$kfw-breakpoint-mobile: 37.5rem;
|
|
250
250
|
$kfw-breakpoint-tablet: 52.5rem;
|
|
251
251
|
$kfw-breakpoint-desktop: 60rem;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* KfW Design Tokens v0.
|
|
2
|
+
* KfW Design Tokens v0.3.0
|
|
3
3
|
* Copyright 2025
|
|
4
4
|
* Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
*/
|
|
@@ -126,9 +126,9 @@
|
|
|
126
126
|
--kfw-base-borderwidth-lg: 0.2rem;
|
|
127
127
|
--kfw-base-fontweight-regular: 400;
|
|
128
128
|
--kfw-base-fontweight-medium: 500;
|
|
129
|
-
--kfw-base-letterspacing-tight: -0.
|
|
129
|
+
--kfw-base-letterspacing-tight: -0.5px;
|
|
130
130
|
--kfw-base-letterspacing-normal: 0;
|
|
131
|
-
--kfw-base-letterspacing-wide: 0.
|
|
131
|
+
--kfw-base-letterspacing-wide: 0.5px;
|
|
132
132
|
--kfw-base-letterspacing-wider: 1px;
|
|
133
133
|
--kfw-base-layout-breakpoint-xs: 32rem;
|
|
134
134
|
--kfw-base-layout-breakpoint-sm: 60rem;
|
|
@@ -249,7 +249,7 @@
|
|
|
249
249
|
--kfw-focusring-outline-offset: 0.2rem;
|
|
250
250
|
--kfw-focusring-outline-style: dashed;
|
|
251
251
|
--kfw-fontweight: 400;
|
|
252
|
-
--kfw-fontweight-
|
|
252
|
+
--kfw-fontweight-bold: 500;
|
|
253
253
|
--kfw-breakpoint-mobile: 60rem;
|
|
254
254
|
--kfw-breakpoint-tablet: 84rem;
|
|
255
255
|
--kfw-breakpoint-desktop: 96rem;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* KfW Design Tokens v0.
|
|
2
|
+
* KfW Design Tokens v0.3.0
|
|
3
3
|
* Copyright 2025
|
|
4
4
|
* Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
*/
|
|
@@ -540,7 +540,7 @@ export const KfwFocusringOutlineWidth: string;
|
|
|
540
540
|
export const KfwFocusringOutlineOffset: string;
|
|
541
541
|
export const KfwFocusringOutlineStyle: string;
|
|
542
542
|
export const KfwFontweight: number;
|
|
543
|
-
export const
|
|
543
|
+
export const KfwFontweightBold: number;
|
|
544
544
|
export const KfwBreakpointMobile: string;
|
|
545
545
|
export const KfwBreakpointTablet: string;
|
|
546
546
|
export const KfwBreakpointDesktop: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* KfW Design Tokens v0.
|
|
2
|
+
* KfW Design Tokens v0.3.0
|
|
3
3
|
* Copyright 2025
|
|
4
4
|
* Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
*/
|
|
@@ -242,9 +242,9 @@ export const KfwBaseBorderwidthMd = "1px";
|
|
|
242
242
|
export const KfwBaseBorderwidthLg = "0.2rem";
|
|
243
243
|
export const KfwBaseFontweightRegular = 400;
|
|
244
244
|
export const KfwBaseFontweightMedium = 500;
|
|
245
|
-
export const KfwBaseLetterspacingTight = "-0.
|
|
245
|
+
export const KfwBaseLetterspacingTight = "-0.5px";
|
|
246
246
|
export const KfwBaseLetterspacingNormal = "0";
|
|
247
|
-
export const KfwBaseLetterspacingWide = "0.
|
|
247
|
+
export const KfwBaseLetterspacingWide = "0.5px";
|
|
248
248
|
export const KfwBaseLetterspacingWider = "1px";
|
|
249
249
|
export const KfwBaseLayoutBreakpointXs = "32rem";
|
|
250
250
|
export const KfwBaseLayoutBreakpointSm = "60rem";
|
|
@@ -544,7 +544,7 @@ export const KfwFocusringOutlineWidth = "0.2rem";
|
|
|
544
544
|
export const KfwFocusringOutlineOffset = "0.2rem";
|
|
545
545
|
export const KfwFocusringOutlineStyle = "dashed";
|
|
546
546
|
export const KfwFontweight = 400;
|
|
547
|
-
export const
|
|
547
|
+
export const KfwFontweightBold = 500;
|
|
548
548
|
export const KfwBreakpointMobile = "60rem";
|
|
549
549
|
export const KfwBreakpointTablet = "84rem";
|
|
550
550
|
export const KfwBreakpointDesktop = "96rem";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
// KfW Design Tokens v0.
|
|
2
|
+
// KfW Design Tokens v0.3.0
|
|
3
3
|
// Copyright 2025
|
|
4
4
|
// Licensed under MPL-2.0 (https://github.com/openkfw/design-tokens/blob/main/LICENSE)
|
|
5
5
|
|
|
@@ -122,9 +122,9 @@ $kfw-base-borderwidth-md: 1px;
|
|
|
122
122
|
$kfw-base-borderwidth-lg: 0.2rem;
|
|
123
123
|
$kfw-base-fontweight-regular: 400;
|
|
124
124
|
$kfw-base-fontweight-medium: 500;
|
|
125
|
-
$kfw-base-letterspacing-tight: -0.
|
|
125
|
+
$kfw-base-letterspacing-tight: -0.5px;
|
|
126
126
|
$kfw-base-letterspacing-normal: 0;
|
|
127
|
-
$kfw-base-letterspacing-wide: 0.
|
|
127
|
+
$kfw-base-letterspacing-wide: 0.5px;
|
|
128
128
|
$kfw-base-letterspacing-wider: 1px;
|
|
129
129
|
$kfw-base-layout-breakpoint-xs: 32rem;
|
|
130
130
|
$kfw-base-layout-breakpoint-sm: 60rem;
|
|
@@ -245,7 +245,7 @@ $kfw-focusring-outline-width: 0.2rem;
|
|
|
245
245
|
$kfw-focusring-outline-offset: 0.2rem;
|
|
246
246
|
$kfw-focusring-outline-style: dashed;
|
|
247
247
|
$kfw-fontweight: 400;
|
|
248
|
-
$kfw-fontweight-
|
|
248
|
+
$kfw-fontweight-bold: 500;
|
|
249
249
|
$kfw-breakpoint-mobile: 60rem;
|
|
250
250
|
$kfw-breakpoint-tablet: 84rem;
|
|
251
251
|
$kfw-breakpoint-desktop: 96rem;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@openkfw/design-tokens",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "The source of truth for KfW-branded digital products.",
|
|
5
5
|
"files": [
|
|
6
6
|
"output",
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"style-dictionary": "^5.0.4",
|
|
50
50
|
"tsx": "^4.20.5",
|
|
51
51
|
"typescript": "^5.9.2",
|
|
52
|
-
"typescript-eslint": "^8.44.
|
|
52
|
+
"typescript-eslint": "^8.44.1",
|
|
53
53
|
"npm-check-updates": "^18.3.0"
|
|
54
54
|
}
|
|
55
55
|
}
|