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.
Loading 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;