Resources
Find additional resources, tools, and links to help you work with Naos Design System.
Design Resources
Figma
Access our Figma component library:
- Naos Design Library - Main component library
- Figma Setup Guide - How to use Naos in Figma
- Design Tokens Plugin - Sync tokens with Figma
Design Files
- Color Swatches - Downloadable color palettes
- Icon Library - SVG icon set
- Templates - Starting templates for common screens
Developer Resources
Code
- GitHub Repository - View source code
- Storybook - Interactive component playground
- npm Package - Install via npm
Tools
- VS Code Snippets - Code snippets for common components
- ESLint Plugin - Linting rules for Naos
- Component Generator - CLI tool for scaffolding
Examples
- Example Projects - Sample applications using Naos
- CodeSandbox Templates - Quick start templates
- Integration Examples - Framework-specific examples
Learning
Guides
- About Naos - Introduction to Naos
- Component Guidelines - Using components effectively
- Pattern Library - Common design patterns
Tutorials
- Building Your First App - Step-by-step tutorial
- Theming and Customization - Customize Naos for your needs
- Accessibility Best Practices - Making accessible interfaces
Videos
- Naos Overview - Introduction video
- Component Deep Dives - Detailed component walkthroughs
- Design to Code Workflow - From Figma to implementation
Community
Get Involved
- Contributing Guide - How to contribute
- GitHub Issues - Report bugs or request features
- Discussions - Ask questions and share ideas
Team
Standards and Guidelines
Accessibility
- WCAG 2.1 Guidelines - Web accessibility standards
- ARIA Practices - ARIA authoring practices
- Accessibility Checklist - Our internal accessibility checklist
Best Practices
- React Best Practices - React guidelines we follow
- TypeScript Guidelines - TypeScript conventions
- Code Review Checklist - What we look for in reviews
Design Principles
- Design Philosophy - Our design principles
- Writing Guidelines - Content and microcopy standards
- Internationalization - i18n best practices
Releases
Changelog
- Release Notes - What's new in each version
- Migration Guides - Upgrading between versions
- Deprecation Policy - How we handle breaking changes
Versioning
We follow Semantic Versioning:
- Major (1.0.0) - Breaking changes
- Minor (0.1.0) - New features, backward compatible
- Patch (0.0.1) - Bug fixes
Support
Getting Help
- FAQ - Frequently asked questions
- Troubleshooting - Common issues and solutions
- GitHub Issues - Report problems
Contact
- Design System Team - [email protected]
- Slack Channel - #design-system
- Office Hours - Every Tuesday 2-3pm
External Resources
Inspiration
Other design systems we admire: