SUI Dashboard
Hero Section
A collections of hero sections. Each hero section is a different and powered by @shadcn and Tailwind CSS.
Take control
on your daily expenses
Our A.I helps you to predict your expenses based on your previous activity and shares how you should manage you money.
Get started for freeApp available on
Installation
📍 Install dependencies
pnpm i lucide-react📍 Add util file
lib/utils.ts
import { ClassValue, clsx } from "clsx";
import { twMerge } from "tailwind-merge";
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs));
}
📍 Add the following code in tailwind.config.js file
const defaultTheme = require("tailwindcss/defaultTheme");
const colors = require("tailwindcss/colors");
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{js,jsx,ts,tsx}"],
theme: {
extend: {
// Add your custom configurations here
},
},
plugins: [],
};
Be a hero in a world full of sidekicks.
Suman Sharma
CEO @whysumancode.com