About

What is Foundations?

Foundations is an opinionated collection of components, patterns, and guidelines for building modern digital products. While it includes a robust set of UI components, it goes far beyond basic interface elements to provide comprehensive resources for building complete digital experiences.

From web applications to marketing sites, Foundations covers everything from foundational UI components to advanced interaction patterns, state management strategies, content modeling, and performance optimizations. It's designed to help developers create high-quality digital products by providing well-documented, tested, and production-ready solutions.

How to use Foundations

There are two main ways to use Foundations:

1. Copy and Customize: Take the components, patterns, or entire feature implementations you need and integrate them directly into your project. Each solution is designed to be self-contained and easily customizable. This approach gives you full control over the code and allows you to modify it to match your specific requirements.

2. Learning Resource: Use Foundations as a reference and learning tool. Study our implementation patterns, from accessibility considerations in UI components to complex state management in applications, or content modeling for data-heavy products. This knowledge can help you build your own solutions from scratch with confidence.

Project context

Foundations was created by Significa as an internal resource to:

• Document our approaches and best practices for building digital products
• Bootstrap new projects with proven, production-ready solutions
• Speed up development while maintaining high standards for user experience, accessibility, and performance
• Share knowledge and promote good practices within our team
• Standardize our approach to common challenges in web development

While this is primarily an internal tool, we've made it open source to contribute to the developer community and share our learnings.

Project inspirations

Foundations draws inspiration from several excellent projects in the developer community:

• shadcn/ui: For its innovative approach to component distribution and documentation
• Lucia Auth: For its excellent documentation structure and learning resources
• Other similar projects that prioritize education and flexibility over traditional dependency-based solutions

However, we take a broader approach. While these projects focus on specific aspects of web development, Foundations aims to be a comprehensive resource covering the full spectrum of modern web development, from UI components to complete application architectures and beyond.

What sets Foundations apart is our focus on:

• Complete solutions over isolated components
• Production-ready patterns over basic implementations
• Real-world scenarios over simplified examples
• Documentation over dependencies
• Learning resources over black-box solutions
• Flexibility over one-size-fits-all approaches

Philosophy

Unlike traditional libraries that you install as dependencies, Foundations takes a different approach:

• Solutions are meant to be copied and customized
• Documentation explains not just what things do, but why and how they work
• Code is written to be read and understood, not just used
• Best practices for accessibility, performance, and SEO are built-in, not afterthoughts
• Patterns are based on real-world production use, not theoretical examples

This approach means you're not tied to our update cycle, version constraints, or design decisions. You have full control over the code you use, while still benefiting from our years of experience building digital products.

Getting Started

Ready to dive in? Check out the Setup guide to start using Foundations in your project, or explore our UI components to see what's available.