Stella

$99 $89
Save $10 - Hurry! Get It Before It’s Gone!

Build your next SaaS, startup, or business website with Stella, a modern Astro Js multipurpose theme built for performance, design, and growth. Stella is perfect for founders, developers, and agencies who want a lightning-fast Astro website without sacrificing flexibility or style.

With advanced SEO optimization, multilingual support, and fully customizable layouts, Stella helps you create professional websites for SaaS platforms, agencies, landing pages, or product showcases — all powered by Astro’s blazing speed.

Bring your pages to life with interactive, physics-based animations and a sleek modern UI. Stella includes everything you need to highlight your products or services, attract customers, and grow your online presence effortlessly.

:NOTE

All graphics used in this theme are included as a .fig file, allowing you to easily customize or replace them with your own content in Figma.

alt text

Pages

SEO

  • Achieve a 100/100 Google Lighthouse SEO score. 🚀

  • Dynamically generate Sitemap and Robots.txt files with full control via config.toml:

    [seo]
      author = "Getastrothemes"
      keywords = [
        "digital agency, stella astro template, astro template, astro theme, stella theme, stella astro theme, astro portfolio theme, astro portfolio template, astro agency template, astro agency theme",
      ]
      robots = "index, follow"
      
      [seo.robotsTxt]
        enable = true
        disallow = ["/_astro/", "/cdn-cgi/"]
      
      [seo.sitemap]
        enable = true
        exclude = []
  • Configure Google Analytics, Google Tag Manager, Plausible Analytics, and Umami Analytics directly in config.toml.

  • Add any custom tracking code to the <head> tag through config.toml.

  • Automatically generated Title and Meta tags for each page.

  • Auto-generated Open Graph (OG) metadata for Facebook, Twitter, and other social platforms.

  • Option to override Title, Meta tags, and OG metadata per page using frontmatter.

  • Built with Semantic HTML5 & Added html markup best practices for better accessibility and search engine indexing.

  • No JavaScript links or onClick events to improve crawlability.

  • Statically generated pages ensure blazing-fast performance and easy indexing.

Included Shortcodes

Stella comes packed with a rich library of prebuilt components and shortcodes designed to speed up development and elevate user experience. Some highlights include:

  • Buttons with creative hover animations (creative-fill, magnetic, text-flip, magnetic-text-flip)
  • Accordions for structured collapsible content
  • Tabs for organizing sections efficiently
  • Notices (info, warning, success, error) for contextual alerts
  • Video Embed with support for YouTube and HTML5 video
  • Card Blocks for services or features with CTA buttons
  • Image & Video Lists for dynamic media layouts
  • Testimonials with customer avatars and logos
  • Markdown Enhancements: blockquotes, code blocks, tables, and heading customization

These reusable elements are fully customizable, responsive, and integrated with the theme’s design system — making it easier to build pages without writing boilerplate code.

Privacy

  • No analytics, tracking, or cookies are enabled by default, ensuring user privacy.
  • Supports GDPR-compliant analytics providers like Plausible and Umami as alternatives to Google Analytics.
  • Self-hosted Google Fonts by default for improved performance and privacy.
    • Switch seamlessly between self-hosting and Google Fonts CDN with a single line in src/config/fonts.json.
# Site Configuration
[site]
  title            = "Stella" # Shared title for SEO and OpenGraph
  description      = "A customizable and multipurpose saas & startup astro theme built with Tailwind CSS and Astro Js" # Shared description for SEO and OpenGraph
  tagline          = "Multipurpose Saas & Startup Astro Js Theme"
  taglineSeparator = "" # default is " - " 
  baseUrl          = "https://stella-astro.netlify.app" # Base URL for the site and used in OpenGraph meta tags.
  logo             = "/images/logo.svg" # Path to the site's logo
  logoText         = "Stella" # Text displayed next to the logo
  logoWidth        = "2rem" # Width of the logo
  logoHeight       = "2rem" # Height of the logo
  • Fully customizable logos for desktop and mobile. Control size, text, color, and more for a polished look on all devices. 👌
  • Advanced sticky header with the option to disable it in config.toml.

Fonts

  • Configure fonts easily in src/config/fonts.json, with the flexibility to switch between self-hosted and CDN Google Fonts.
  • Includes SVG Repo Icons for crisp and scalable visuals.

Social

  • Configure social media links in src/config/social.json.

  • Auto-generate Open Graph metadata for Facebook and Twitter cards, fully customizable in config.toml.

      # OpenGraph Metadata
      # Specific OpenGraph settings, using values from the [site] section where possible.
      # -----------------------------------------------------------------------------------------------------------------------------------
      [opengraph]
        image        = "/images/og-image.jpg" # Image used in OpenGraph previews
        ogLocale    = "en_US" # Locale setting for OpenGraph
        ogType      = "website" # Type of content for OpenGraph protocol
        twitter      = "" # Twitter handle for Twitter Card meta tags
        twitterCard = "summary_large_image" # Type of Twitter Card to use in social sharing

Blog

  • Modern layouts for blog pages.
  • Support for Markdown and MDX content.
  • Built-in syntax highlighting for code blocks using shiki.
  • Auto-generate table of contents for longer posts.
  • Supports multi-author blog posts with author metadata.
  • Tags and categories support.
  • SEO-ready with auto meta and OG tags for blog posts.
  • Fully responsive blog layout and typography with Tailwind Prose.
  • Draft mode support for staging unpublished content.
{
  "enable": true,
  "name": "Components",
  "url": "/components/",
  "weight": 0,
  "badge": {
    "enable": true,
    "label": "NEW",
    "color": "accent",
    "_color_comment": "color expected value - accent, info, success, danger, dark",
    "type": "text",
    "_type_comment": "type expected value - text, dot"
  }
},
  • Fully responsive mega menu for easy navigation.
  • Includes an animated hamburger menu and multi-level dropdown menus.
  • Automatically sets rel and target attributes for external links.
  • Special link highlights:
    • Badge Link Highlighter for dynamic updates like “New” or notification counts.
    • Dot Link Highlighter for subtle indications of active or unread links.

Contact Form

# documentation - https://formspree.io/ | https://formsubmit.co/ | https://docs.netlify.com/forms/setup/
# Form action URL for the contact form (For more settings related to form see "src/content/sections/contact-section.md")
contactFormAction = "https://formsubmit.co/your_form_submission_receive_email" # https://formspree.io/f/your_form_id | https://formsubmit.co/your_form_submission_receive_email | "/"

# formspree | formsubmit.co | netlify (default is formsubmit.co) 
contactFormProvider = "formsubmit.co"
  • Features advanced form validation.
  • Pre-configured for multiple form submission services:
    • Formsubmit.co: Add your email in config.toml.
    • Netlify Forms: Works out of the box when hosting on Netlify.
    • Formspree: Add your Formspree ID in config.toml.
  • Dynamic form messages for success or error handling.
  • Includes a searchable advanced select input.
  • Easily generate form inputs and notes via frontmatter.
      inputs:
      - label: ""
        placeholder: "Subject *"
        name: "Subject" # This is crucial. Its indicate under which name you want to receive this field data
        required: false
        halfWidth: true
        dropdown:
          type: "" # select | search - default is select
          search: # if type is search then it will work
            placeholder: ""
          items:
            - label: "General Inquiry"
              value: "General Inquiry"
              selected: false
            - label: "Investment Opportunity"
              value: "Investment Opportunity"
              selected: false

Website content

  • Includes real content, so you don’t need to start from scratch.
  • All photos, illustrations, and icons are royalty-free and ready to use.

Newsletter

# Mailchimp Subscription Form located in footer
[settings.subscription]
  enable      = true # Enables or disable the subscription form
  title       = "" # Check src/i18n/en.json and src/i18n/fr.json for changing the title in different languages or directly add value here if you are not using internationalization feature
  note       = "" # Check src/i18n/en.json and src/i18n/fr.json for changing the note in different languages or directly add value here if you are not using internationalization feature
  formAction = "https://gmail.us11.list-manage.com/subscribe/post?u=d870b06d86c16269e4b1f9b39&amp;id=12cf0c6ac2&amp;f_id=007e61e1f0"
  mailchimpTagValue = ""
  • Built-in support for Mailchimp subscriptions.

Ready to Deploy

Stella comes ready for production with pre-configured deployment setups for leading platforms. Just push and go:

  • Netlify: Includes netlify.toml for automatic builds, headers, redirects, and optimized asset caching.
    • Seamless CI/CD support with each Git push.
    • Custom headers to support Astro’s static assets and performance best practices.
  • Vercel: Comes with vercel.json and optional deployment scripts.
    • Handles both preview and production deployments with environment-specific settings.
    • Built-in support for redirects and rewrites.
  • Cloudflare Pages: Easily deploy by selecting the dist/ folder as the output directory.
    • Works out of the box with zero configuration needed.
  • Static Hosting: Run astro build and upload the dist/ folder to any static host (e.g., GitHub Pages, Firebase Hosting, Surge).