Coral Use Cases
A friendly and inviting use cases section designed for nonprofit organizations — warm coral and peach tones on a cream background.
Features
- 4 use case cards — Fundraising, Volunteer Management, Impact Reporting, Donor Engagement
- Distinctive icons for each use case from Lucide
- Color-coded accent system — each card has its own accent color (coral, orange, fuchsia)
- Hover effects — cards lift and glow on hover with smooth transitions
- Learn more links with animated arrow indicators
- Soft dot pattern background for organic texture
- Trust bar with organization name placeholders
- Nunito font for a warm, rounded feel
- Responsive grid — stacks on mobile, 2-column on desktop
- Dark mode support with warm dark tones
Usage
import CoralUseCases from '@/registry/coral-use-cases/registry-item';
export default function Page() {
return <CoralUseCases />;
}
Customization
- Use cases: Edit the
useCases array to change content, icons, and accent colors
- Colors: Adjust coral (
#f97066), peach (#fecdd3), and cream (#fffbeb) values
- Font: Replace Nunito with another rounded or friendly sans-serif
- Trust bar: Replace placeholder organization names with real logos or names
- Layout: Switch to 3-column grid by changing
md:grid-cols-2 to lg:grid-cols-3
