Project Overviewlink

Mokko is a static HTML template designed for creative agencies and portfolio showcases, featuring complete pages including Home, Portfolio, Blog, Shop, and Team. It comes with built-in interactive effects such as Swiper carousels, GSAP animations, and custom cursors, making it ideal for quickly building agency or design studio websites.

Tech Stacklink

• Static HTML5 / CSS3
• JavaScript (Vanilla + jQuery)
• Swiper (Carousel)
• GSAP (Animation)
• Font Awesome 6 (Icons)

Project Structurelink

mokkohtml-10/
├── documentation/          # Online documentation
│   ├── index.html
│   └── assets/
│       ├── css/main.css
│       └── js/main.js
└── mokko-html/              # Template main body
    ├── index.html           # Entry page
    ├── about.html
    ├── blog.html
    ├── shop.html
    ├── contact.html
    └── assets/
        ├── css/style.css
        └── js/main.js

Core File Descriptionlink

• mokko-html/index.html — Homepage template, integrates carousel and navigation
• mokko-html/assets/css/style.css — Main stylesheet, includes a complete CSS variable system
• mokko-html/assets/js/main.js — Interaction logic, Swiper, GSAP, cursor following, etc.
• documentation/index.html — Template usage documentation entry
• documentation/assets/css/main.css — Documentation page styles

Quick Startlink

This is a purely static project. Simply open mokko-html/index.html directly in your browser to preview the full effect. To run with a local server, use:

# Python 3
python -m http.server 8080

# Node.js (npx)
npx serve mokko-html

Usage Suggestionslink

The template offers multiple homepage variants (index.html, index-two.html, etc.). It is recommended to select the appropriate file as the entry point based on your business scenario before replacing the content.