Components
A high-quality, remixable EXP Level Card component that displays a user’s current level and progress toward the next level. It features an interactive tilt effect and is fully customizable via props for colors, starting stats, and EXP curves.
npx @21st-dev/cli add dhileepkumargm/exp-level-cardLoading preview...
import React from 'react';
import ExpLevelCard from '@/components/ui/exp-level-card';
function App() {
return (
<div
className="
min-h-screen
bg-[hsl(var(--background))]
text-[hsl(var(--foreground))]
flex
items-center
justify-center
p-4
"
>
<ExpLevelCard
initialLevel={3}
initialExp={40}
expIncrement={60}
baseColorClass="from-blue-600 to-indigo-900"
highlightColorClass="border-indigo-400"
/>
</div>
);
}
export default App;