installing-westpac-ui
Installation
SKILL.md
Installing @westpac/ui
Step-by-step setup for new projects using the GEL design system.
When to Use
Reference this guide when a user wants to set up the GEL design system in a new project. This includes installing the necessary packages, configuring Tailwind CSS, setting up theming with brand tokens, and adding brand fonts.
Steps
- Install Packages
GEL is split into two packages:
@westpac/ui— All design system components@westpac/style-config— Tailwind CSS themes and design tokens
npm i @westpac/ui @westpac/style-config
Related skills
More from westpacgel/gel-next
using-westpac-ui
Guides consumers of the @westpac/ui component library on correct usage, capabilities, and patterns. Use when asking how to use a GEL component, whether a component supports a feature, or how to implement a UI pattern with @westpac/ui.
12migrating-to-westpac-ui-v1
Guides migration from pre-@westpac/ui 1.0 to v1.0. Use when upgrading GEL, migrating to v1, updating design tokens, running the token codemod, or fixing breaking changes from the v1 upgrade.
7