Is your company struggling to build shared components across teams using a diverse set of frontend frameworks and technologies, all while enforcing brand guidelines and exceeding accessibility standards?
The Stencil team is helping many large teams and enterprises build Design Systems at scale. Let us help make your Design System initiative successful.
Yes, the official Stencil project is 100% free and open source (MIT licensed), and always will be. We offer Stencil DS for teams undertaking large Design System initiatives which offers additional features and tools that are not free. This keeps the lights on and lets us keep making the Stencil you know and love better and better, all while helping teams be successful with their Design System initiatives.
Stencil builds standard Web Components that run in all modern browsers, with intelligent loading of any necessary polyfills for clients with missing APIs.
However, developers often prefer a framework's conventions for naming and usage that deviates from typical Web Component usage. In addition, building a library that can be consumed natively in each framework is tricky and is a moving target.
To help with this, Stencil DS automatically generates up-to-date libraries for all major frameworks and smooths out any rough edges in their Web Component support. This also makes using Stencil-built components feel native to each framework and work like other component libraries for that framework.
Teams building Design Systems are looking to bring consistent, well-supported components to all corners of their app and web properties. For most teams, that means enabling web and marketing teams to drop in components from your Design System directly in their CMS workflow is key.
Stencil integrates with many popular CMS solutions to bring your Design System directly to content creators in a way that works naturally with their existing tools, all while preserving the performance and accessibility benefits of a Stencil-built component system.
One of the greatest challenges for Design Systems is adoption. Developers will take the path of least resistance to get their work done, and that means the best documentation wins.
To ensure your Design System achieves mass adoption, Stencil DS generates top-quality documentation automatically from your components, with rich metadata about properties and events gathered directly from your component code.
Stencil DS generates live examples, code snippets, and an index of all your components in a beautiful but easily customizable fashion, to make it incredibly fast and easy for developers to find and use the components they need.
The team behind Stencil DS's documentation generation built Ionic Framework's documentation , regarded by many as some of the best developer documentation for an open source project. We can bring that level of developer regard directly to your Design System's official documentation.
Building a Design System with Web Component APIs that exceeds accessibility standards is not straightforward. Stencil DS comes with a number of features and tools that help verify and enforce accessibility support for your components in a continuous way that can be easily integrated into your Continuous Integration workflow.
This goes above and beyond existing Accessibility testing tools and ensures your Design System initiative meets and exceeds all legal requirements for Accessibility.
One of the biggest challenges to building any sophisticated component kit or Design System is ensuring components don't have visual regressions due to changes in styles or issues with specific browsers.
Unfortunately, traditional unit testing or snapshot testing is not sufficient to test visual style and layout changes. The Ionic team built out a set of powerful visual regression testing tools to ensure consistency between releases.
Stencil DS brings these powerful visual regression tools to teams building Design Systems, and helps them integrate with your existing Continuous Integration workflow to provide UI verification on every single commit.
While Stencil has an active community and is being actively maintained, there are cases where certain bugs or features are not a priority due to misalignment with our open source roadmap or time constraints.
For teams deploying major Design System initiatives, relying on open source and community support is not sufficient. You'll need assurance that key issues or features are identified and communicated quickly, with potential fixes or workarounds made available in a timely fashion.
With Stencil DS, Premium Support is provided and teams will have a dedicated account manager to communicate with if anything goes wrong.
Yes! The Stencil team is the same team that built and deployed one of the most successful open source Design Systems ever: Ionic Framework. Today, Ionic is used by millions of developers for over five million applications.
Not only that, but the team behind Stencil is a leader in modern Web APIs and Progressive Web Apps, and has unique expertise that is difficult to find anywhere else.
We work with major enterprise companies and high growth startups undertaking major Design System initiatives that can't afford to fail, and we're ready to help your team, too!