Skip to content

doc: update copy #1977

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
staszek998 wants to merge 2 commits into
base: main
Choose a base branch
from
Open

doc: update copy #1977

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1f157b3
docs: update copy
staszek998 Nov 25, 2025
00bf7f0
chore: yarn prettier:write
staszek998 Dec 16, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions docs/stories/01-foundations/icons/overview.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,9 +37,9 @@ export default ForwardRef;

## Adding new icons

It's important when exporting an icon that they are designed "correctly" i.e. contained within a 32x32px bounding box,
this ensures all our icons are uniform and scale similarly across the application when used. Typically, icons come from
the design-team and are exported from Figma in SVG format, the result of which, may look like this:
It's important when exporting an icon that it's designed "correctly" i.e. contained within a 32x32px bounding box - this
ensures all our icons are uniform and scale similarly across the application when used. Typically, icons come from the
design-team and are exported from Figma in SVG format, the result of which may look like this:

```xml
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
Expand All @@ -53,15 +53,15 @@ However, to be used in the library, we need to make the following changes:
- Remove `fill="none"` from the root `svg` element
- Remove any fill values from `path` elements.

This svg then becomes:
This SVG then becomes:

```xml
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path d="M26.7075 12.7075L16.7075 22.7075C16.6146 22.8005 16.5043 22.8742 16.3829 22.9246C16.2615 22.9749 16.1314 23.0008 16 23.0008C15.8686 23.0008 15.7385 22.9749 15.6171 22.9246C15.4957 22.8742 15.3854 22.8005 15.2925 22.7075L5.29249 12.7075C5.15248 12.5676 5.05712 12.3894 5.01846 12.1953C4.97981 12.0012 4.99962 11.8 5.07537 11.6172C5.15112 11.4344 5.27942 11.2782 5.44401 11.1683C5.60861 11.0584 5.8021 10.9998 5.99999 11H26C26.1979 10.9998 26.3914 11.0584 26.556 11.1683C26.7206 11.2782 26.8489 11.4344 26.9246 11.6172C27.0004 11.8 27.0202 12.0012 26.9815 12.1953C26.9429 12.3894 26.8475 12.5676 26.7075 12.7075Z" />
</svg>
```

If figma exports a `clipPath` element, consult whether it's necessary for the icon to function correctly. If it's not,
If Figma exports a `clipPath` element, consult whether it's necessary for the icon to function correctly. If it's not,
remove it:

```xml
Expand Down