Clean Card
For content-heavy sections, forms, FAQs, and standard informational blocks.
RASYA Design System
Care, clarity, and quiet innovation.
A premium visual system for RASYA Foundation built around The RASYA Pathway: Discover, Develop, Communicate, Learn, Thrive, and Belong.
01 / Color System
Restrained color. Strong emotional clarity.
The website should be led by deep navy, clinical blue, calm teal, soft gold, white surfaces, and mist backgrounds. Program colors are used as accents, not as overwhelming page colors.
Primary
var(--primary)
Secondary
var(--secondary)
Tertiary / Gold
var(--tertiary)
Teal
var(--teal)
Purple
var(--purple)
Green
var(--green)
Orange
var(--orange)
Cream
var(--cream)
02 / Typography
Modern, human, readable.
Typography should feel clinically credible, donor-friendly, and accessible. Headings use strong hierarchy. Body text stays generous and readable.
Display Heading
Discover. Develop. Communicate. Learn. Thrive. Belong.
Section Heading
Six programs. One pathway of transformation.
Body Text
RASYA Foundation empowers children, families, senior citizens, neurodiverse individuals, and underserved communities through early identification, timely intervention, inclusive support, and sustainable empowerment.
Small Label
Impact opportunities / donor-ready / accessible
03 / Section Backgrounds
Soft depth without visual noise.
Most sections should feel calm and open. Use true glass only for emphasis, while simple and premium surfaces carry the majority of the site.
Clean Surface
Best for long content, FAQs, forms, resources, and legal pages.
Soft Mist
Best for program intros, pathway sections, and general page rhythm.
Premium Dark
Best for trust, donation, impact, partner, and final CTA sections.
04 / Cards & Glass
Three levels of surface intensity.
The design should use approximately 60% clean surfaces, 30% premium cards, and 10% true liquid-glass highlights.
Premium Card
For program cards, impact cards, story cards, partner cards, and product cards.
Liquid Glass
For hero overlays, featured CTAs, trust highlights, and special donor panels.
05 / Buttons & Badges
Clear actions. Calm confidence.
Buttons should be rounded, accessible, and purposeful. Gold is reserved mainly for donation and high-priority impact actions.
Buttons
Use primary for main actions, gold for donation, and secondary/glass for lower-priority actions.
Badges
Badges help users understand pathway stages, program categories, and opportunity status.
DiscoverDevelopCommunicateLearnThriveBelong
06 / Program Theme Preview
One pathway. Six distinct accents.
Program colors should identify each pathway stage while the overall website remains unified, premium, and restrained.
Discover
Suvarna Bhaviṣyattu
Early screening, awareness, parent education, and timely referral pathways.
Develop
Sāmarthya Dānam
Diagnostics, therapy, rehabilitation, treatment support, and family guidance.
Communicate
Śravaṇa Dānam
Hearing aids, cochlear implant support, device donations, and hearing rehabilitation.
Learn
Sandhya Samayam Chaduvu
School readiness, education support, books, teacher resources, and inclusive learning.
Thrive
Swayam Krushi
Livelihood, self-employment, corporate gifting, and family empowerment.
Belong
Mana Ooru Mana Bādhyata
Community development, rural outreach, volunteerism, and local responsibility.