# Porsche Design System — Design Style Reference

> **Unofficial, community-authored reference.** Compiled by [designsystems.one](https://www.designsystems.one). Not affiliated with, endorsed by, or sponsored by Porsche. "Porsche Design System" and related marks belong to their respective owners. This document describes publicly observable style attributes in original words — it contains no copied documentation, logos, icon artwork, or original token files. Always defer to the official source for canonical, current values.

**System:** Porsche Design System
**Owner:** Porsche
**Official documentation:** https://designsystem.porsche.com/


---

## Summary

Porsche's branded system of web components with React, Angular, and Vue wrappers plus UX guidelines.

## Engineering profile

- **Ships for:** Web Components, React, Angular, Vue
- **Source model:** Open source
- **Figma:** Official Figma kit

## Apply this style with an AI tool

Paste this into your AI coding assistant as a direction, then iterate:

> Design in the spirit of Porsche Design System by Porsche — Porsche's branded system of web components with React, Angular, and Vue wrappers plus UX guidelines. Match the intent, not the pixels; adapt it to my product rather than cloning it.

## Official reference

- [Porsche Design System documentation](https://designsystem.porsche.com/)

---

_Generated by [designsystems.one](https://www.designsystems.one/design-systems/porsche-design) — a catalogue of public design systems. Style facts are reported for reference and education; adapt them to your own product. Report issues or takedown requests via the site._
