Heartlight is a complete non-profit & charity website and admin template for supporters, built with Angular. Tagline on the demo: "Together we can change lives".

One download gives you 258 pages that share one theme: a marketing site, a 14-page admin dashboard, a full UI kit with copy-ready code, 41 example pages and 100 working forms - all in light and dark mode and responsive down to 360 px.

What's inside

• Home page - Three Column layout, plus a gallery of 14 page layouts (single column, sidebar, split screen, bento, masonry, magazine, F- and Z-pattern and more)
• Admin dashboard - 14 pages with a top navigation look: overview, analytics, orders, customers, products, invoice, calendar, kanban, messages, files, profile, settings, notifications, 404
• UI kit - 70 documentation pages (tools, components, helpers, utilities), 20 live examples each with a Preview / Code switch and a Copy button
• 41 example pages - album, blog, checkout, dashboard, pricing, product, sign-in, navbars, sidebars, footers, heroes and more, several with right-to-left versions
• 100 full forms with validation - login, register, 2FA setup, checkout, payment, booking, surveys, HR and admin forms
• Modern CSS effects - animations (glitch-text, typewriter, bouncing-text); clip-path (star-rotate, ellipse-morph, wave-animation); filters (hue-rotation, filter-neon-glow); transforms (translate-3d, 3d-rotating-cube); transitions (3d-flip-card, neon-fill-button, split-text-fill); gradients (animated-border, moving-stripes, shimmer-effect); shadows (outline-glow, neumorphism); backgrounds (bg-particles, bg-gradient-flow)
• 6 theme modes - light, dark, dim, sepia, high contrast and auto (follows the system), remembered per visitor
• 2,000+ icons (Bootstrap Icons) and original SVG illustrations - no stock licences needed
• documentation.html, README.md and PAGES.md (every page listed)

Design

• Colours: primary #f43f5e, secondary #fb7185, accent #0ea5e9
• Fonts: Poppins (Google Fonts)
• Every colour, font and corner radius is a token in one file (theme.css) - rebrand the whole template in minutes
• The demo brand is the placeholder "Brand name 19" - replace it and the logo SVG with your own

Tech

• Angular - Angular 22.2.3
• A ready Angular CLI workspace: npm install, then npm start (http://localhost:4200) or npm run build. Needs Node.js 22.22+ or 24.15+.
• Works in Chrome, Edge, Firefox, Opera (last 2 versions) and Safari 16.4+ on macOS and iOS
• Clean, semantic, accessible HTML (skip link, labelled controls, keyboard-friendly menus)

Licence options

• Personal - one end product for yourself or one client
• Commercial - unlimited end products for yourself and your clients
• Extended - end products sold to many users (SaaS, themes sold inside a product)

You may change the template in any way, but not resell or share the template itself. Free updates for version 1.x.

Screenshots show the real pages of this download.