Set of UI components for pancake projects

Usage no npm install needed!

<script type="module">
  import africaswapUikit from 'https://cdn.skypack.dev/@africaswap/uikit';


Africaswap UIkit

Version Size

Africaswap UIkit is a set of React components and hooks used to build pages on Africaswap's apps. It also contains a theme file for dark and light mode.


yarn add @africaswap/uikit



Before using Africaswap UIkit, you need to provide the theme file to styled-component.

import { ThemeProvider } from 'styled-components'
import { light, dark } from '@africaswap/uikit'
<ThemeProvider theme={isDark}>...</ThemeProvider>


A reset CSS is available as a global styled component.

import { ResetCSS } from '@africaswap/uikit'
<ResetCSS />


This project is built with Typescript and export all the relevant types.

How to use the UIkit

If you want to use components from the UIkit, check the Storybook documentation