Modern Theme Module is a premium front-end theme add-on for Stockifly SAAS – Billing & Inventory Management with POS and Online Shop that transforms your SaaS landing page with a stunning dark UI, smooth animations, glassmorphism effects, and a fully responsive modern design.

Important Note: This is NOT a standalone script. It is an add-on that requires Stockifly SAAS – Billing & Inventory Management with POS and Online Shop to be installed and running. It will not work independently.

Stockifly SAAS - Billing & Inventory Management with POS and Online Shop Stockifly SAAS Documentation Stockifly SAAS Support Join Telegram

How It Works

Switch to the Modern Theme in 3 simple steps:

  1. Download & Extract: Download the theme module from CodeCanyon and extract the ZIP file
  2. Copy to Root: Copy the contents of the extracted folder into your Stockifly SAAS root directory
  3. Activate: Add FRONT_THEME="modern" to your .env file — that’s it!

Animated Hero Section

  • Animated Background Grid: Subtle grid pattern with gradient orbs and glowing particles for a premium visual backdrop
  • Rotating SVG Circles: Multi-color gradient circles with continuous rotation and staggered animation timing
  • 3D Browser Mockup: Interactive tilt effect on the hero browser card using VanillaTilt library with realistic perspective
  • Glowing Border Animation: Animated gradient border on the browser mockup with shimmer and reflection effects
  • Browser Chrome UI: Realistic window controls with red, yellow, and green buttons with soft glowing shadows

Dark Mode Design

  • Professional Dark UI: Sleek dark color palette with carefully crafted contrast ratios for optimal readability
  • Glassmorphism Effects: Modern backdrop blur, semi-transparent cards, and layered depth throughout the design
  • Gradient Accents: Blue, purple, cyan, and emerald gradient accents for visual hierarchy and modern aesthetics
  • CSS Custom Properties: HSL-based color system with opacity variants for consistent theming
  • Glow & Shadow Effects: Multi-layer shadows and glow effects on cards, buttons, and interactive elements

Smooth Animations & Effects

  • Scroll-Triggered Animations: Elements gracefully animate into view with fade-in, scale, and slide transitions on viewport entry
  • Staggered Delays: CSS variable-based staggered animation delays for sequential entrance effects across card grids
  • Lenis Smooth Scrolling: Buttery-smooth page scrolling with natural deceleration curves for a premium feel
  • Hover Interactions: Spotlight hover effects on cards, scale transitions on images, and lift animations on buttons
  • Text Animations: Animated text effects on section titles and hero headings

Testimonials with Infinite Marquee

  • Dual Marquee Rows: Two rows of testimonials scrolling in opposite directions for visual interest
  • Seamless Infinite Loop: Content duplicated 3x for smooth, gap-free continuous scrolling
  • Star Ratings: Dynamic 5-star rating display for each testimonial
  • User Avatars: Circular profile images with styled borders
  • Client Logo Marquee: Continuous scrolling brand logos on the homepage

Interactive Pricing Section

  • Monthly/Yearly Toggle: Animated billing period switcher with smooth thumb transition
  • Popular Plan Badge: Distinctive highlighted badge for the recommended pricing plan
  • Feature Checklists: Green checkmark icons for included features in each plan
  • 3-Column Grid: Responsive pricing cards with hover effects and shadow transitions
  • Dynamic Pricing Data: All plans and prices loaded from your Stockifly SAAS admin panel

Fully Responsive Design

  • Mobile-First Approach: Pixel-perfect responsiveness across all screen sizes (sm, md, lg, xl breakpoints)
  • Mobile Navigation Drawer: Dedicated hamburger menu with animated open/close transitions and overlay backdrop
  • Mobile Language Accordion: Collapsible language selector optimized for mobile touch interaction
  • Adaptive Grid Layouts: Cards and sections automatically adjust from 3 columns to 2 to 1 column based on screen width
  • Touch-Friendly Elements: All buttons, links, and interactive elements sized for comfortable touch targets

All Pages Redesigned

  • Homepage: Animated hero with browser mockup, client logos, alternating features, testimonial marquees, and CTA section
  • Features Page: 3-column responsive feature grid with icon images, spotlight hover effects, and staggered animations
  • Pricing Page: Monthly/yearly toggle, pricing cards with popular badge, feature checklists, and FAQ accordion
  • Contact Page: 3-column info cards, AJAX-powered contact form, social media icons, and floating decorative elements
  • Registration Page: Split-screen layout with feature benefits grid, subdomain input, and real-time AJAX form validation
  • Email Verification Page: Animated SVG success checkmark with stroke animations, floating particles, and success/error states
  • Dynamic Pages: Custom page template for any CMS pages created from the admin panel

Navigation & Layout

  • Fixed Sticky Header: Navigation bar stays visible on scroll with fade-in animation
  • Multi-Column Footer: Logo, product links, page links, and contact information organized in columns
  • Social Media Icons: Facebook, Twitter, LinkedIn, Instagram, and YouTube icons in footer and contact page
  • Footer Watermark: Large semi-transparent brand text for added visual identity
  • Background Grid Pattern: Subtle dot grid overlay throughout the site for depth

CTA & Conversion Elements

  • Call-to-Action Section: Eye-catching CTA with decorative animated circles and floating dots
  • Email Input Box: Inline email form with integrated submit button
  • Stats Display: Key metrics with checkmark icons to build trust
  • Privacy Badge: Lock icon with security message for user confidence

Admin Panel Integration

  • CMS-Powered Content: All headings, descriptions, features, and testimonials loaded from your admin panel
  • Dynamic Pricing: Subscription plans and pricing pulled directly from your Stockifly SAAS database
  • Logo & Branding: Site logo, favicon, and brand colors configured from admin settings
  • Social Links: Facebook, Twitter, LinkedIn, Instagram, YouTube URLs from admin configuration
  • Contact Information: Email, phone, and address displayed from admin settings

Technology Stack

  • Tailwind CSS: Utility-first CSS framework for maintainable, responsive styling
  • Lenis: Smooth scroll library for premium page scrolling experience
  • VanillaTilt: Lightweight 3D tilt effect library for interactive elements
  • Inter Font: Clean, modern typeface from Google Fonts optimized for screen readability
  • Laravel Blade: Native Laravel templating with dynamic data binding

Easy Theme Switching

  • One-Line Configuration: Simply set FRONT_THEME="modern" in your .env file to activate
  • Instant Switch: Change FRONT_THEME to "front" to revert to the default theme — no cache clearing needed
  • Non-Destructive: Both themes coexist — switch freely between modern and default without losing anything

Complete Feature List

  • Dark mode professional UI design
  • Glassmorphism card effects with backdrop blur
  • Animated hero section with background grid and gradient orbs
  • 3D tilt browser mockup with VanillaTilt
  • Rotating SVG circle animations
  • Glowing border and shimmer effects
  • Scroll-triggered entrance animations
  • Staggered animation delays
  • Lenis smooth scrolling
  • Infinite marquee testimonials (dual direction)
  • Client logo marquee
  • Star rating display
  • Monthly/yearly pricing toggle
  • Popular plan badge
  • Feature checklists with icons
  • FAQ accordion section
  • AJAX-powered contact form
  • AJAX registration with real-time validation
  • Split-screen registration layout
  • Subdomain input field support
  • Animated SVG email verification page
  • Floating particle effects
  • Fixed sticky navigation bar
  • Mobile hamburger menu with drawer
  • Mobile language accordion
  • Multi-column footer with social icons
  • Footer watermark branding
  • CTA section with stats and email input
  • Multi-language support with switcher
  • All content from admin panel (CMS)
  • Dynamic pricing from subscription plans
  • Social media integration
  • Inter font family
  • Tailwind CSS framework
  • CSS custom properties (HSL)
  • Fully responsive (mobile, tablet, desktop)
  • Touch-friendly interactive elements
  • One-line .env theme activation
  • Non-destructive theme switching
  • 7 fully redesigned pages
  • 6 reusable section partials

Requirements

This Add-On Requires

Installation

  1. Download and extract the ZIP file from CodeCanyon
  2. Copy the contents of Stockifly-SAAS-theme-modern-1.0.0 folder to your Stockifly SAAS root directory
  3. Add FRONT_THEME="modern" to your .env file
  4. Visit your site — the Modern Theme is now active!

Reminder: This add-on requires Stockifly SAAS – Billing & Inventory Management with POS and Online Shop to be installed. It is not a standalone product.

codecanyon-62050345-modern-theme-module-for-stockifly-saas.zip

You May Also Like