typography-2026-humanist-warm

What problem does it solve?

This Skill provides a curated set of humanist fonts and design tokens to create warm, approachable, and highly readable user interfaces, especially for sectors like healthcare, education, and government.

Core Features & Use Cases

• Font Selection: Offers a selection of humanist sans-serif fonts (Source Sans Pro, Lato, Open Sans, Noto Sans) with clear guidance on pairings and use cases.
• Design Tokens: Provides pre-defined typography scales, weights, and accessibility settings for consistent UI implementation.
• Component Examples: Includes ready-to-use React Native components (Text, FormField, InfoCard) demonstrating how to integrate the typography.
• Accessibility Focus: Emphasizes accessible design practices with font scaling, contrast checks, and recommended line lengths.
• Use Case: Implement a new healthcare app's UI, ensuring all text is clear, legible, and conveys a sense of trust and warmth using the recommended Source Sans Pro pairings and accessible design tokens.

Quick Start

Apply the humanist-warm typography to your React Native project by installing the necessary expo-font packages and loading the fonts in your app's layout.