Note: I couldn't list all of the features here, i request you guys to check out the site by clicking the image below & please take a look on every message, feature & image.
Note: You can enable or disable any component of the site from the single file. Preview of the file is given below.
Code:
export interface CursorConfig {
name: string;
url: string;
hotspotX?: number;
hotspotY?: number;
}
export interface ProjectItem {
id: string;
title: string;
description: string;
image: string;
link: string;
category?: string;
status?: string;
tech?: string[];
duration?: string;
isActive: boolean;
}
export interface SiteSection {
isEnabled: boolean;
title: string;
subtitle: string;
}
export interface SiteConfig {
siteName: string;
tagline: string;
description: string;
// Component visibility
sections: {
hero: SiteSection;
graphics: SiteSection;
videos: SiteSection;
labs: SiteSection;
};
// Cursors
cursors: {
light: CursorConfig[];
dark: CursorConfig[];
currentLightCursor: number;
currentDarkCursor: number;
};
// Content
hero: {
mainTitle: string;
subtitle: string;
description: string;
primaryButtonText: string;
secondaryButtonText: string;
};
graphics: {
projects: ProjectItem[];
};
videos: {
longForm: ProjectItem[];
shortForm: ProjectItem[];
};
labs: {
apps: ProjectItem[];
servers: ProjectItem[];
collaborations: ProjectItem[];
};
footer: {
companyName: string;
description: string;
copyrightText: string;
links: Array<{ name: string; url: string }>;
socialLinks: Array<{ name: string; url: string; icon: string }>;
};
navigation: {
logo: string;
links: Array<{ name: string; target: string }>;
};
}
export const siteConfig: SiteConfig = {
siteName: "Phant Development",
tagline: "Where Creativity Meets Innovation",
description: "Creating digital experiences that inspire and innovate",
sections: {
hero: {
isEnabled: true,
title: "Hero",
subtitle: "Main landing section"
},
graphics: {
isEnabled: true,
title: "Graphics",
subtitle: "Visual storytelling through innovative design"
},
videos: {
isEnabled: true,
title: "Videos",
subtitle: "Bringing stories to life through motion and sound"
},
labs: {
isEnabled: true,
title: "Labs",
subtitle: "Experimental projects and innovations"
}
},
cursors: {
light: [
{
name: "default",
url: "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQgNEwyMCAyMEwxMiAxNkwxMCAxOEw0IDRaIiBmaWxsPSIjMDAwMDAwIiBzdHJva2U9IiNGRkZGRkYiIHN0cm9rZS13aWR0aD0iMS41Ii8+CjxwYXRoIGQ9Ik0xMiAxNkwyMCAyMEwxNiAyMEwxMiAxNloiIGZpbGw9IiMwMDAwMDAiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIxIi8+Cjwvc3ZnPg==",
hotspotX: 4,
hotspotY: 4
},
{
name: "pointer",
url: "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggNEw4IDIwTDE0IDE0TDE4IDEyTDggNFoiIGZpbGw9IiMwMDAwMDAiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPGNpcmNsZSBjeD0iMTYiIGN5PSIxMCIgcj0iMyIgZmlsbD0iIzAwNzJGRiIgc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2Utd2lkdGg9IjEiLz4KPC9zdmc+",
hotspotX: 8,
hotspotY: 4
}
],
dark: [
{
name: "default",
url: "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQgNEwyMCAyMEwxMiAxNkwxMCAxOEw0IDRaIiBmaWxsPSIjRkZGRkZGIiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIxIi8+CjxwYXRoIGQ9Ik0xMiAxNkwyMCAyMEwxNiAyMEwxMiAxNloiIGZpbGw9IiNGRkZGRkYiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPGNpcmNsZSBjeD0iMTYiIGN5PSIxMCIgcj0iMyIgZmlsbD0iIzAwN0NGRiIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2Utd2lkdGg9IjEiLz4KPC9zdmc+",
hotspotX: 4,
hotspotY: 4
},
{
name: "pointer",
url: "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggNEw4IDIwTDE0IDE0TDE4IDEyTDggNFoiIGZpbGw9IiNGRkZGRkYiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPGNpcmNsZSBjeD0iMTYiIGN5PSIxMCIgcj0iMyIgZmlsbD0iIzAwN0NGRiIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2Utd2lkdGg9IjEiLz4KPC9zdmc+",
hotspotX: 8,
hotspotY: 4
}
],
currentLightCursor: 0,
currentDarkCursor: 0
},
hero: {
mainTitle: "Phant Development",
subtitle: "Phant Walker",
description: "Where Creativity Meets Innovation",
primaryButtonText: "Explore My Work",
secondaryButtonText: "View Projects"
},
graphics: {
projects: [
{
id: "1",
title: "Reflex Arena | Ultimate Aim Training Web",
description: "Complete brand identity packages with logo, colors, and typography",
image: "https://builtbybit.com/attachments/untitled-design-3-png.965211/?variant=display?w=800&h=600&fit=crop",
link: "https://builtbybit.com/resources/reflex-arena-ultimate-aim-training-web.67926/",
category: "Website",
isActive: true
},
{
id: "2",
title: "FentMC | Premium Lifesteal Setup",
description: "FentMC is a futuristic, modern Lifesteal setup packed with unique features and smooth gameplay.",
image: "https://builtbybit.com/attachments/custom-resdssource-pack-png.963503/?variant=display?w=800&h=600&fit=crop",
link: "https://builtbybit.com/resources/fentmc-premium-lifesteal-setup.67532/",
category: "MC Server Setup",
isActive: true
},
{
id: "3",
title: "Phantastic | Premium portfolio website",
description: "A premium portfolio that needs zero manual edits | fully customizable straight from the admin panel.",
image: "https://builtbybit.com/attachments/untitled-design-1-png.939996/?variant=display?w=800&h=600&fit=crop",
link: "https://builtbybit.com/resources/phantastic-premium-portfolio-website.65272/",
category: "Portfolio Website",
isActive: true
},
{
id: "4",
title: "NextGen Voting Site for Minecraft Server",
description: "NextGen Voting Site is the ultimate self-hosted solution for Minecraft server owners.",
image: "https://builtbybit.com/attachments/voting-site-png.933462/?variant=display?w=800&h=600&fit=crop",
link: "https://builtbybit.com/resources/nextgen-voting-site-for-minecraft-server.64524/",
category: "MC Voting Website",
isActive: true
}
]
},
videos: {
longForm: [
{
id: "1",
title: "MC Web Template Preview | Phant Development",
description: "Responsive, customizable Minecraft web template for easy setup and sleek design. Perfect for servers",
image: "https://builtbybit.com/attachments/untitled-design-3-png.945162/?variant=display?w=800&h=600&fit=crop",
link: "https://youtu.be/oL0NK7qKg-Y?si=k7h50Ro2PJwKrt5e",
duration: "00:51",
isActive: true
},
{
id: "2",
title: "Brand Story: Innovation Labs",
description: "Corporate storytelling that connects and inspires",
image: "https://images.unsplash.com/photo-1533482458-95ad4b1b5b96?w=800&h=600&fit=crop",
link: "https://www.youtube.com/@PhantWalker",
duration: "8:45",
isActive: true
}
],
shortForm: [
{
id: "3",
title: "Quick Tips: Design Principles",
description: "Bite-sized design wisdom for creators",
image: "https://images.unsplash.com/photo-1502920917128-1aa500764cbd?w=400&h=600&fit=crop",
link: "https://www.youtube.com/@PhantWalker",
duration: "0:45",
isActive: true
},
{
id: "4",
title: "Behind the Scenes",
description: "Creative process in action",
image: "https://images.unsplash.com/photo-1520637836862-4d197d17c93a?w=400&h=600&fit=crop",
link: "https://www.youtube.com/@PhantWalker",
duration: "1:20",
isActive: true
},
{
id: "5",
title: "Product Showcase",
description: "Dynamic product presentations",
image: "https://images.unsplash.com/photo-1493932484895-752d1471eab5?w=400&h=600&fit=crop",
link: "https://www.youtube.com/@PhantWalker",
duration: "0:30",
isActive: true
}
]
},
labs: {
apps: [
{
id: "1",
title: "TaskFlow Pro",
description: "Advanced project management with AI-powered insights",
image: "https://images.unsplash.com/photo-1488590528505-98d2b5aba04b?w=600&h=400&fit=crop",
link: "https://discord.phantwalker.com",
tech: ["React", "Node.js", "AI/ML"],
status: "Live",
isActive: true
},
{
id: "2",
title: "Creative Suite",
description: "All-in-one design tools for digital creators",
image: "https://images.unsplash.com/photo-1461749280684-dccba630e2f6?w=600&h=400&fit=crop",
link: "https://discord.phantwalker.com",
tech: ["Vue.js", "Python", "WebGL"],
status: "Beta",
isActive: true
}
],
servers: [
{
id: "3",
title: "Gaming Server Network",
description: "High-performance game servers with custom mods",
image: "https://images.unsplash.com/photo-1526374965328-7f61d4dc18c5?w=600&h=400&fit=crop",
link: "https://gaming-network.com",
tech: ["Docker", "Redis", "Node.js"],
status: "Active",
isActive: true
},
{
id: "4",
title: "API Gateway",
description: "Scalable microservices architecture",
image: "https://images.unsplash.com/photo-1500673922987-e212871fec22?w=600&h=400&fit=crop",
link: "https://api-gateway.com",
tech: ["Kubernetes", "Go", "PostgreSQL"],
status: "Production",
isActive: true
}
],
collaborations: [
{
id: "5",
title: "Design System Co-op",
description: "Open-source design system with 50+ contributors",
image: "https://images.unsplash.com/photo-1649972904349-6e44c42644a7?w=600&h=400&fit=crop",
link: "https://design-system.com",
tech: ["Figma", "React", "Storybook"],
status: "Active",
isActive: true
},
{
id: "6",
title: "Startup Partnership",
description: "Technical co-founder for fintech startup",
image: "https://images.unsplash.com/photo-1581091226825-a6a2a5aee158?w=600&h=400&fit=crop",
link: "https://fintech-startup.com",
tech: ["React Native", "Blockchain", "AWS"],
status: "Ongoing",
isActive: true
}
]
},
footer: {
companyName: "Phant Development",
description: "Creating digital experiences that inspire and innovate. Let's build something amazing together.",
copyrightText: "Crafted with passion and code.",
links: [
{ name: "Portfolio", url: "#graphics" },
{ name: "Contact", url: "#contact" },
{ name: "Blog", url: "#blog" },
{ name: "Services", url: "#services" }
],
socialLinks: [
{ name: "GitHub", url: "https://github.com", icon: "github" },
{ name: "Twitter", url: "https://twitter.com", icon: "twitter" },
{ name: "LinkedIn", url: "https://linkedin.com", icon: "linkedin" },
{ name: "Instagram", url: "https://instagram.com", icon: "instagram" }
]
},
navigation: {
logo: "Phant Nexus",
links: [
{ name: "Home", target: "home" },
{ name: "Graphics", target: "graphics" },
{ name: "Videos", target: "videos" },
{ name: "Labs", target: "labs" }
]
}
};Latest reviews
- LilRosieRae
- Version: v1.0
I recommend this portfolio for anyone and everyone. This is simple to configure and very easy to use. 10/10, another great project Phant
I’m really glad you found it easy to use and worth recommending, means a lot to me.
More awesome stuff coming soon!