What is Frontend Dump?
A "dump" of Frontend Libraries
Frontend Dump combines multiple popular frontend UI libraries into a one Next.js app.
Every library shares the same design tokens: colors, typography, spacing, breakpoints & more.
The libraries currently combined are:
One Change Updates All
The src/styles/config/ folder is the single source of truth.
When a value is changed there (colour, font size, radius size, etc.), every library picks it up automatically through the codegen pipeline.
1. Change custom variable
/* colors-light.css */
:root {
--custom-color-primary: #357a6e;
}2. AUTOMATIC token & code generation
// tokens.ts
export const tokens = {
light: { colorPrimary: "#357a6e" },
};/* colors-rgb.css */
:root {
--custom-color-primary-rbg: 53 112 110
}3. Libraries updated INSTANTLY
With custom css variables:
/* shadcn.css */
@theme inline {
...
--color-primary: var(--custom-color-primary);
}
/* reactbootstrap.css */
:root {
...
--bs-primary: var(--custom-color-primary);
--bs-primary-rgb: var(--custom-color-primary-rgb);
}With TypeScript tokens:
// muiTheme.ts
const muiTheme = createTheme({
...
colorSchemes: {
light: {
palette: {
primary: {
...
main: tokens.light.colorPrimary,
},
}
}
}
});
// antdTheme.ts
export const antdTheme: ThemeConfig = {
algorithm: antdTheme.defaultAlgorithm,
token: {
...
colorPrimary: tokens.light.colorPrimary,
}
}UI Interactive Showcase
The interactive demo shows the same set of components rendered by each library side by side.
Every component (buttons, text, modals, dropdowns, etc.) uses the shared design tokens so that the design remains consistent.
Creator: Derek Daquel
Hello! I'm glad you found my Frontend Dump.
I initially started this project because I had made a few websites which used components from different frontend libraries. It gave me a thought:
What if I could just setup all the frontend libraries I use, and use this as my template for future websites?
This became the motivation for building this project. However, I left this project incomplete.
I'm glad to say that after nearly 2 years (first Github commit was in August 2024), I'm glad to have released the first version of this project in March 2026
