A modern, premium landing page template for Minecraft servers. Built with TailwindCSS, featuring live server status, smooth animations, and anti-theft protection.
---
- Live Server Status - Real-time player count and server status via mcstatus.io API
- One-Click IP Copy - Copy server IP with beautiful toast notifications
- Auto Server Location - Automatically detects and displays server location with country flag
- Staff Team Section - Showcase your team with Minecraft avatars from mc-heads.net
- Mobile Responsive - Fully responsive design for all devices
- Modern UI - Glassmorphism, gradients, and smooth animations
- 3D Mouse Parallax - Hero background follows mouse movement
- Animated Elements - Floating particles, pulsing status dots, hover effects
- Premium Glow Effect - Eye-catching glow animations on key elements
- Dark Theme - Beautiful dark gaming aesthetic
- DevTools Detection - Blocks page content when DevTools is opened
- Right-Click Disabled - Prevents context menu access
- Keyboard Shortcuts Blocked - Blocks Ctrl+U, Ctrl+S, F12, Ctrl+Shift+I
- Configurable - Can be disabled for development
- Store integration (Tebex, CraftingStore, etc.)
- Discord invite button
- Vote links
1. Download the template files
2. Upload to your web hosting
3. Edit
assets/js/config.js to customize4. Done! Your landing page is ready
---
All settings are in
assets/js/config.js:Template Branding
JavaScript:
template: {
name: "CubicHome", // Your brand name
year: "2025", // Copyright year
copyright: "© {year} {name} Template",
templateProtect: true // Anti-theft protection (true/false)
}
JavaScript:
server: {
name: "Your Server Name", // Displayed in hero section
ip: "play.yourserver.com", // Server IP for players
port: 25565, // Server port
isBedrock: false, // true for Bedrock servers
}
JavaScript:
links: {
store: {
enabled: true,
url: "https://store.yourserver.com",
label: "Store",
description: "Get ranks & items"
},
discord: {
enabled: true,
url: "https://discord.gg/YOUR_INVITE"
},
vote: {
enabled: true,
url: "https://minecraft-server.net/vote/yourserver"
}
}
JavaScript:
staff: [
{
username: "Notch", // Minecraft username (auto-fetches avatar)
role: "Owner", // Their role
color: "amber", // Tailwind color: amber, red, blue, green, purple
},
// Add more staff members...
];
JavaScript:
features: [
{
icon: "bi-gem", // Bootstrap icon
title: "Custom Items",
description: "Unique weapons and tools.",
gradient: "from-purple-500 to-pink-500",
},
// Add up to 4 features...
];
JavaScript:
theme: {
enableSmoothScroll: true, // Smooth scroll on anchor clicks
enableAnimations: true, // Enable scroll animations
enableParallax: true // Enable mouse parallax effect
}
Changing Colors
Edit the TailwindCSS config in
index.html:
JavaScript:
tailwind.config = {
theme: {
extend: {
colors: {
primary: "#4ade80", // Main green
"primary-dark": "#22c55e",
accent: "#fbbf24", // Gold accent
surface: "#1e293b",
dark: "#0f172a",
},
},
},
};
Replace
assets/img/hero.jpg with your own image.Changing Favicon
Replace
assets/img/favicon.png with your own favicon.---
Code:
CubicHome/
├── index.html # Main HTML file
├── README.md # This file
├── assets/
│ ├── css/
│ │ └── style.css # All custom styles
│ ├── js/
│ │ ├── config.js # Configuration file
│ │ └── main.js # Main JavaScript
│ └── img/
│ ├── hero.jpg # Hero background
│ └── favicon.png # Site favicon
- HTML5 - Semantic markup
- TailwindCSS - Utility-first CSS (via CDN)
- Bootstrap Icons - Icon library (via CDN)
- Vanilla JavaScript - No jQuery required
- mcstatus.io API - Server status
- mc-heads.net - Minecraft avatars
- flagcdn.com - Country flags
- ipwho.is - IP geolocation
The template includes built-in protection against unauthorized copying:
| Feature | Description |
| ------------------ | --------------------------------------------- |
| DevTools Detection | Replaces page content when DevTools is opened |
| Right-Click Block | Disables context menu |
| Ctrl+U Block | Prevents View Source shortcut |
| F12 Block | Prevents DevTools shortcut |
| Debugger Detection | Detects paused JavaScript execution |
To disable for development:
JavaScript:
template: {
templateProtect: false; // Disable protection
}
Template by: illusion @ CodeStrike.STORE
Terms of Use:
Use for personal or client projects
Modify and customize as needed
Resell or redistribute the template
Remove credits without permission
Made with
