Usage guidelines
Guidance explains how to choose a pattern and what still needs validation.
Created & adapted by Insan NurjamanChakra UI foundationCurated public preview
Make the choice explainable
Usage guidance covers action hierarchy, semantic versus categorical color, icon slots, field feedback, and upload contexts. Maintain guidance alongside the model: Button state/palette inventories and InputElement types currently need reconciliation with older documentation.
- Define the task and the context before choosing a component.
- Review default, active, disabled, and exception states as relevant.
- Include text-based feedback and clear recovery.
- Validate keyboard access, contrast, and responsive behavior in real code.
Original guidance
Original exported design. Open to inspect at full size. Source appearance is preserved; private editable files are not linked.Public scope
This documentation presents curated source evidence and illustrative interactions. It is not a complete mirror, an editable library, or a downloadable production package. Source frameworks retain their credit. Adoption, code synchronization, accessibility conformance, and measured impact are not claimed.
Curated design documentation by Insan Nurjaman. Native examples are illustrative, not a production package or a standards certification.
Explore the story