Import and use components

This part of the documentation relates to premium templates built with Cruip CSS framework only. If the template you are using is built on the top of Tailwind CSS, please refer to the last part of the documentation.

If you are familiar with React you don't need to read this chapter 🙌

Every time you want to use a React component, it needs to be imported first. So, for example, let's see how you can import a component (a button component) into another component (a page component). Following code shows a page component👇

// Page component, for example /src/views/Page.js
import React from 'react';
import Button from '../components/elements/Button';
class Page extends React.Component {
render() {
return (
<Button>My button</Button>
export default Page;

You can learn more about importing components on the Create React App documentation.