Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/stencil-community/awesome-stencil

A curated list of awesome Stencil resources, libraries and tools.
https://github.com/stencil-community/awesome-stencil

List: awesome-stencil

awesome awesome-list ionic stencil web-components

Last synced: about 1 month ago
JSON representation

A curated list of awesome Stencil resources, libraries and tools.

Host: GitHub
URL: https://github.com/stencil-community/awesome-stencil
Owner: stencil-community
License: mit
Created: 2024-01-27T00:24:08.000Z (11 months ago)
Default Branch: main
Last Pushed: 2024-07-10T18:05:24.000Z (5 months ago)
Last Synced: 2024-07-10T21:39:21.195Z (5 months ago)
Topics: awesome, awesome-list, ionic, stencil, web-components
Homepage: https://stenciljs.com
Size: 114 KB
Stars: 5
Watchers: 3
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- Contributing: contributing.md
- License: LICENSE

Awesome Lists containing this project

ultimate-awesome - awesome-stencil - A curated list of awesome Stencil resources, libraries and tools. (Programming Language Lists / JavaScript Lists)

README

        # Awesome Stencil [![Awesome](https://awesome.re/badge-flat2.svg)](https://awesome.re) [![Test](https://github.com/stencil-community/awesome-stencil/actions/workflows/test.yaml/badge.svg)](https://github.com/stencil-community/awesome-stencil/actions/workflows/test.yaml)

**A curated list of awesome [Stencil](https://stenciljs.com/) resources, libraries, tools and applications**

Inspired by the [awesome][0] list. Feel free to improve this list by [contributing](https://github.com/stencil-community/awesome-stencil/blob/master/contributing.md)!

## Contents

- [Stencil Ecosystem](#stencil-ecosystem)

  - [Documentation](#documentation)

  - [Community](#community)

- [Design Systems](#design-systems)

- [UI Libraries](#ui-libraries)

- [Components built with Stencil](#components-built-with-stencil)

- [Plugins](#plugins)

- [Starter Templates](#starter-templates)

## Stencil Ecosystem

### Documentation

- [Stencil Documentation](https://stenciljs.com/docs/introduction) - Stencil Documentation.

- [Stencil v3 Docs](https://stenciljs.com/docs/v3/introduction) - Stencil v3 Documentation.

- [Stencil v2 Docs](https://stenciljs.com/docs/v2/introduction) - Stencil v2 Documentation.

### Community

- [Discord Server](https://chat.stenciljs.com/?_gl=1*uree5e*_ga*OTQxMjI1NDgwLjE2OTU1MTg0OTk.*_ga_REH9TJF6KF*MTcwNjMxMzY2NS44My4xLjE3MDYzMTQyMDAuMC4wLjA.)

- [Stencil on Twitter](https://twitter.com/stenciljs)

- [Stencil on GitHub](https://github.com/ionic-team/stencil)

## Design Systems

Awesome Design Systems build with StencilJS.

- [Siemens Industrial Experience (iX)](https://github.com/siemens/ix) - Siemens Industrial Experience is a design system for designers and developers, to consistently create the perfect digital experience for industrial software products.

- [KoliBri](https://github.com/public-ui/kolibri) - KoliBri stands for "Component library for the accessibility" and was from the Informationstechnikzentrum Bund (ITZBund) open source released for reuse and further development.

- [Calcite Design System](https://github.com/Esri/calcite-design-system) - Esri's Calcite Design System.

- [Swiss Post Design System](https://github.com/swisspost/design-system) - The Swiss Post Design System pattern library for a unified and accessible user experience across the web platform.

- [Duet Design System](https://github.com/duetds) - Duet provides a set of organized tools, patterns and practices that work as the foundation for LocalTapiola and Turva digital products and experiences.

- [Scale](https://github.com/telekom/scale) - Scale is the digital design system for Telekom products and experiences.

- [Porsche Design System](https://github.com/porsche-design-system/porsche-design-system) - Find all the fundamental UXI guidelines and pattern-based web components to build brand-driven, consistent and intuitive designs for digital Porsche products.

- [Atomium - Design System](https://github.com/juntossomosmais/atomium) - Atomium is an internal design system for 'Juntos Somos Mais' using Web Components.

- [The Baloise Design System](https://github.com/baloise/design-system) - Consists of reusable components and a clearly defined visual style, that can be assembled together to build any number of applications.

- [BEEQ, a web component library initiative](https://github.com/Endava/BEEQ) - BEEQ Design System, is a web component library ruled by Endavan developers.

- [Infineon Design System](https://github.com/Infineon/infineon-design-system-stencil) - As part of the Infineon brand guidelines, the Infineon Digital Design System supports designers, developers and project managers to build user interfaces faster and better – with the ultimate goal of creating a coherent and optimal user journey across all internal and external Infineon digital touchpoints.

- [Klevu's brand new SDK](https://github.com/klevultd/frontend-sdk) - Monorepository for Klevu headless.

- [SIX UI Library](https://github.com/six-group/six-webcomponents) - Ready to use Web Components in alignment with the SIX Corporate Styleguide.

- [Swisscom Digitial eXperience](https://sdx.swisscom.com/) - The design system of the leading telecom provider in Switzerland, called "Swisscom Design eXperience".

## UI Libraries

- [GOAT UI](https://github.com/goatui/components) - Contains most used web components built using Stencil. So you don't need to include any additional framework dependencies, You can simply import the required component js, and right away start using it.

- [DSO Toolkit](https://github.com/dso-toolkit/dso-toolkit) - Design System of the Digitaal Stelsel Omgevingswet (DSO).

- [Bulmil](https://github.com/Gomah/bulmil) - An agnostic UI components library based on Web Components, made with Bulma & Stencil.

- [Kelvin UI Components](https://github.com/kelvininc/ui-components) - Kelvin UI Components provides a set of reusable, high quality framework-agnostic UI components, this means you can use them with the current most popular Front-End Development Frameworks like React, Angular or if you prefer, the components are also available as W3C compliant WebComponents.

- [AnywhereUI](https://github.com/adaleks/anywhere-ui) - AnywhereUI is a collection of rich web components that includes framework bindings, created with StencilJS.

- [GO UI](https://github.com/getgoui/go-ui) - A design system for everyone.

## Components built with Stencil

- [Web Social Share](https://github.com/peterpeterparker/web-social-share) - A Web Component to share URLs and text on social networks.

- [Image Cropper Component](https://github.com/tony-xlh/image-cropper-component) - An image cropper web component that allows users to crop a rectangle or a 4-point polygon.

- [RevoGrid](https://github.com/revolist/revogrid) - Powerful virtual data grid smartsheet with advanced customization. Best features from excel plus incredible performance.

- [Dough Library](https://github.com/josiahsrc/dough) - This package provides some widgets you can use to create a smooshy UI.

- [qr-code](https://github.com/bitjson/qr-code) - A no-framework, no-dependencies, customizable, animate-able, SVG-based  HTML element.

- [stencil-quill](https://github.com/KillerCodeMonkey/stencil-quill) - Native web components for the Quill Rich Text Editor built with Stencil.

- [sketch-polls](https://github.com/partykit/sketch-polls) - Live poll web component.

- [animate-presence](https://github.com/natemoo-re/animate-presence) - Effortless element entrance/exit animations.

## Plugins

- [stencil-store](https://github.com/ionic-team/stencil-store) - Store is a lightweight shared state library by the StencilJS core team. Implements a simple key/value map that efficiently re-renders components when necessary.

- [stencil-sass](https://github.com/ionic-team/stencil-sass) - Sass plugin for Stencil.

- [stencil-eslint](https://github.com/stencil-community/stencil-eslint) - ESLint rules specific to Stencil JS projects.

- [stencil-postcss](https://github.com/stencil-community/stencil-postcss) - Autoprefixer plugin for Stencil.

- [stencil-helmet](https://github.com/stencil-community/stencil-helmet) - Declaratively update the `` from a Stencil app.

- [stencil-router](https://github.com/stencil-community/stencil-router) - A simple router for Stencil apps and sites.

- [stencil-tailwind-plugin](https://github.com/Poimen/stencil-tailwind-plugin) - Plugin for using Tailwindcss with StencilJS.

## Starter Templates

- [stencil-component-starter](https://github.com/ionic-team/stencil-component-starter) - Minimal starter project for building shareable web components with Stencil.

- [stencil-app-starter](https://github.com/stencil-community/stencil-app-starter) - Minimal starter project for building web components with Stencil.

- [stencil-ionic-starter](https://github.com/stencil-community/stencil-ionic-starter) - Ionic PWA starter with tabs layout and routes.

[Back to top](#contents)

[0]: https://awesome.re