Getting started

Overview

The Contentstack UI Kit is a globally available UI framework built on top of Bootstrap 5. It is meant to be plug-and-play and universal to any front-end frameworks used within the org.

This project is maintained by the Digital Experience team at Contentstack.

Org members can access the code here:

https://github.com/contentstack/contentstack-com-ui

Installation

To use the Contentstack UI Kit, add the following files to your project. Note that we do not maintain the JS used for the UI Kit. As the requirement for JS in this project is minimal, we include the default JS that ships with Bootstrap.

Contentstack UI Kit CSS

<link rel="stylesheet" href="https://ui.contentstack.com/contentstack.min.css">

Bootstrap 5.1.3 JS

<script src="https://ui.contentstack.com/bootstrap.min.js" crossorigin="anonymous"></script>

Contentstack UI Kit (place this after boostrap.min.js)

<script src="https://ui.contentstack.com/contentstack.min.js"></script>

Misc

The Digital Experience team uses NextJS / React for all projects. You'll notice references to NextJS-specific components such as <Link /> and React attributes such as className in the code examples throughout this documentation. NextJS / React are not required for using this UI Kit in your project.

Happy coding