Soft components

Like the recently popular neumorphism design?

You can read more about neumorphism design in these articles:

• Neumorphism in user interfaces
• Neumorphism: why it’s all the hype in UI design
• Neumorphism the right way — A 2020 Design Trend

Use these components with any framework you wish or no framework at all!

Documentation

Getting started

There are a couple of ways you can get started with Soft Components:

CDN

<link rel="stylesheet" href="//unpkg.com/soft-components/dist/soft-components/soft-components.css" />
<script type="module" src="//unpkg.com/soft-components/dist/soft-components/soft-components.esm.js"></script>

<!-- For IE only -->
<script nomodule src="//unpkg.com/soft-components/dist/soft-components/soft-components.js"></script>

Install via npm

npm i soft-components

JS framework integration

Soft components are built with the help of Stencil.

Stencil provides a comprehensive documentation on how the web components can be integrated with popular JavaScript frameworks, they can be found here:

• Angular
• React
• Vue
• Ember

Components roadmap

• [x] sc-progress - progress bar
• [ ] sc-range - input type="range" equivalent
• [ ] sc-dial - dial input
• [ ] sc-radio - radio button
• [ ] sc-select - select dropdown box
• [ ] sc-file - input type="file" equivalent
• [ ] sc-textarea - textarea equivalent