You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: packages/documentation-site/patternfly-docs/content/tokens/design-with-tokens.md
+10-10Lines changed: 10 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -3,11 +3,11 @@ id: Design with tokens
3
3
section: tokens
4
4
---
5
5
6
-
## Penta design kit
6
+
## PatternFly 6 design kit
7
7
8
-
PatternFly tokens are only available as part of the PatternFly 6 [Penta design kit.]() In order to make use of our token system, you will need to [upgrade to PatternFly 6](/get-started/upgrade).
8
+
PatternFly tokens are only available as part of [the PatternFly 6 design kit.](https://www.figma.com/@patternfly) In order to make use of our token system, you will need to [upgrade to PatternFly 6](/get-started/upgrade).
9
9
10
-
## What is in the Penta design kit
10
+
## What is in the PatternFly 6 design kit
11
11
12
12
### Tokens
13
13
@@ -20,21 +20,21 @@ In Figma, the variable names look similar to [token names](/tokens/all-patternfl
20
20
</div>
21
21
<br />
22
22
23
-
### Penta component library
23
+
### Component library
24
24
25
-
You will have access to all PatternFly tokens when you install the component library. Penta components are built with tokens. From the colors used, to the spacing of elements, to the font size: tokens control it all!
25
+
You will have access to all PatternFly tokens when you install the component library. PatternFly 6 components are built with tokens. From the colors used, to the spacing of elements, to the font size: tokens control it all!
26
26
27
27
<divstyle="text-align: center;">
28
28
<img src="./img/component-tokens.png" alt="PatternFly alert components built with Figma tokens." width="700px"/>
29
29
</div>
30
30
31
-
## Using the Penta design kit
31
+
## Using the PatternFly 6 design kit
32
32
33
-
To install the Penta design kit, [find instructions in our design onboarding guide.](/get-started/design#figma-library)
33
+
To install the design kit, [find instructions in our design onboarding guide.](/get-started/design#figma-library)
34
34
35
-
### Using Penta components
35
+
### Using PatternFly 6 components
36
36
37
-
As you insert a component into a design workspace, you can adjust properties and variable modes to customize the appearance to your needs.
37
+
As you insert a component into a Figma design workspace, you can adjust properties and variable modes to customize the appearance to your needs.
38
38
39
39
<divstyle="text-align: center;">
40
40
<img src="./img/component-instance.png" alt="PatternFly alert components built with Figma tokens." width="350px"/>
@@ -53,4 +53,4 @@ Our tokens are intentionally scoped so that they can only be used to modify rele
53
53
54
54
Our tokens are only available within Figma. If you've previously designed with PatternFly by using our Sketch design kits, you will need to begin to create all new product designs within Figma.
55
55
56
-
If you have any existing Sketch-based designs that you want to migrate into Figma, you will need to manually recreate each UI mockup using the Penta component library.
56
+
If you have any existing Sketch-based designs that you want to migrate into Figma, you will need to manually recreate each UI mockup using the PatternFly 6 component library.
0 commit comments