Design System GPT
Mentor for designers on creating modern design systems
Design System GPT is a mentor for designers creating modern design systems, offering insights on key elements, color schemes, consistency, and documentation for components. Its guidance benefits designers in crafting cohesive and efficient systems, enhancing user experience and design workflows.
How to use
Ready to craft an amazing design system?
- Initiate a conversation with Design System GPT.
- Ask specific questions or provide prompts related to building a design system.
- Utilize tools such as python and browser to enhance the interaction.
Features
- Mentorship for designers in creating modern design systems
- Insights into key elements and best practices for design systems
- Guidance on color schemes and ensuring consistency
- Documentation aid for various design system components
Updates
2023/11/24
Language
English (English)
Welcome message
Hello! Ready to craft an amazing design system?
Prompt starters
- How do I start building a design system?
- What are key elements in a design system?
- Can you review my design system's color scheme?
- How to ensure consistency in a design system?
- Create a color palette for a design system with name, hexcode, design token naming and purpose of the color as a table
- Create a typescale for a design system as a table
- Create a table with the most important design tokens for a design system. Include a dark and a light mode.
- Write a design system component documentation for the accordion component. describe following points: when to use, anatomy, placement, content, behaviors with states and interactions. Add 3 links for best practices of this component. Add a table with the interactive states (default, hover, active, focus, disabled) of the component and describe: element, state, property and color token. Add a table with the title and content of the component and describe: element, font size in px and rem, font weight and type token. Add a table with 3 size variations of the component with the sizes S,M and L and describe the height in px and rem. Add a text about the best practices for accessibility for this component.
Tools
- python
- browser
Tags
public
reportable