What it does
Garden is Zendesk’s design system, connecting visual foundations, React components and interface patterns. Component pages include examples, package installation and properties that developers can configure. Its React libraries are free under Apache 2.0; the main documentation currently covers stable Garden 9.
A Garden component page combines design decisions with implementation details. The Button page, for example, distinguishes actions from navigation, shows danger and disabled states, and exposes size and width options. Its demos include Toggle dark mode, Set primary hue, Toggle RTL, Copy code and Open in CodeSandbox.
The Configuration section names the package and dependencies. For the stable button component, install @zendeskgarden/react-buttons with React, styled-components and Garden theming, then use the displayed import. The properties table explains controls such as isDanger, isPrimary and isStretched.
Keep the version consistent
The site covers Garden 9, while the repository’s main branch describes a Garden 10 release candidate with a single combined package. That candidate can still change. Use the stable v9 packages with v9 examples, or follow the v10 migration guide when deliberately adopting the newer release. Both public code and guides can be accessed without a Zendesk product subscription.
Strengths
- Component demos expose theme, direction and size options
- Package names and dependencies appear beside each example
- Patterns add content and interaction context to the components
Watch out for
- Garden 10 is a release candidate whose interfaces may still change
- Version 9 and version 10 use different package structures
Best for
- Product teams studying coordinated interface standards
Sources
- Zendesk Garden (Oct 27, 2026)
- Garden Button component (Oct 27, 2026)
- Garden React Components repository (Oct 27, 2026)
- Garden React Components Apache licence (Oct 27, 2026)