Skip to main content

Extend Infinitely with Custom Components

Bring any React component from the web or your codebase into Superblocks. Customize your internal apps without limits.


Custom Components enables businesses to seamlessly bring fully-featured React components into Superblocks, following these 3 guiding principles:

  • Customization - Developers can build any React component in Superblocks, using any library from the web or existing internal library. Developers retain full styling control for advanced DOM manipulation, and can use modern styling libraries like Tailwind CSS, Styled Components, Sass, and more
  • Reusability - Frontend developers build components once to make them accessible to any Superblocks developer. This model multiplies the ROI on custom development by democratizing access to code and supercharging velocity
  • Developer Experience - Developers build custom components locally in their favorite IDE with hot reloading, and can organize their project as they wish. Custom Component projects are written in TypeScript by default, with an intuitive React API for easy development

Import any React component from the web​

Use popular libraries like MaterialUI, AntDesign, Chakra UI, D3, Lodash, AnimeJS and more. Import with NPM, Yarn, PNPM, or any other package manager.

Learn how to use libraries from the web in Custom Components.

Bring any component from your codebase​

Import components from your organization’s private registry and keep Superblocks Apps up-to-date as your internal library evolves.

Learn how to use components from your company's codebase in Custom Components.

Build once. Reuse infinitely​

Frontend developers build custom components once, enabling your whole team to use them across Superblocks apps without ever touching React.

Learn more about integrating your React code with your Superblocks Apps for maximal reusability.

Style with full DOM control​

Add advanced animations, effects, popovers and more without iframe constraints. Style components with libraries like Tailwind CSS, Styled Components, Sass, and more.

Learn more about styling your Custom Component.

Develop seamlessly in your favorite IDE​

Write TypeScript or JavaScript in VSCode or the IDE of your choice. View real-time changes in your app with hot reloading. Organize your project and bundle multiple files at build time. 

Learn more about developing your component locally in your favorite IDE.