Web Components

Clay is highly flexible, so you can use the components in different applications with frameworks such as Angular, Vue, and React. Feel free to apply the Clay standards in your application.

WebComponents, although not currently natively implemented in browsers, is a web standard that will be available in the future. Clay gives you the ability to use the components as Custom Elements in your HTML markup. Just follow these steps:

1. Install and import the component's JavaScript into your application using one of the methods below:

   • npm
   • CDN

2. Add the component's HTML TAG to your application. The example below adds a Clay button to the page:

<clay-button label="Primary" type="button"></clay-button>

Examples

We have created some example use cases in applications for React, Vue, and Angular for you to follow:

• Angular
• React
• Vue