Components

Component Reference

Complete reference for all CURSY Framework components.

Buttons

.btn-primary

Main call-to-action button with green-cyan gradient.

<a href="#" class="btn-primary">Get Started</a>

Features:

Green-cyan gradient background
Glow effect on hover
Uppercase text with generous letter-spacing
Smooth hover animations

Primary Button

.btn-ghost

Subtle secondary button with border.

<a href="#" class="btn-ghost">Learn More</a>

Features:

Transparent background
Border that changes color on hover
Perfect for secondary actions

Ghost Button

Cards

.card

Standard content card with hover effects.

<div class="card">
  <h3>Card Title</h3>
  <p>Card content goes here</p>
</div>
          

Features:

Subtle radial gradient background
Green glow overlay on hover
Rounded corners (1.1rem)
Shadow for depth

Forms

Input Fields

Message

Checkboxes & Switches

I agree to the terms

Enable notifications

Alerts

Alert Variants

Success! Everything worked.

Info: Here's some information.

Warning: Be careful!

Error: Something went wrong!

Code Example

<div class="alert alert-success">Success!</div>
<div class="alert alert-info">Info</div>
<div class="alert alert-warning">Warning</div>
<div class="alert alert-error">Error</div>
            

Component Reference

Buttons

.btn-primary

.btn-ghost

Cards

.card

Forms

Input Fields

Checkboxes & Switches

Alerts

Alert Variants

Code Example

Navigation Components

Tabs

Breadcrumbs

Pagination

More Components

Progress Bars

Loading Spinner

Accordion