Style Guide / Guidelines Components

contain specific implementation guidelines, visual references, and design principles for creating interfaces or other design deliverables. The most-common style guides tend to focus on branding (colors, typography, trademarks, logos, and print media), but style guides also offer guidance on content (such as tone of voice and language recommendations) and visual- and interaction-design standards (also known as front-end style guides). These guidelines are sometimes incorporated into the component library as well, to provide relevant guidance in context.

Components:

Also known as design libraries These thorough libraries house predetermined, reusable UI elements and serve as a one-stop shop for designers and developers alike to learn about and implement specific UI elements.

Component name:

A specific and unique UI component name, to avoid miscommunication between designers and developers.

Description:

A clear explanation for what this element is and how it is typically used, occasionally accompanied by dos and don’ts for context and clarification.

Attributes:

variables or adjustments that can be made to customize or adapt the component for specific needs (i.e., color, size, shape, copy).