import React, { Suspense, useRef, useState } from "react"; import { createRoot } from "react-dom/client"; import { Canvas, useFrame } from "@react-three/fiber"; import { Environment, Float, Html, OrbitControls } from "@react-three/drei"; import * as THREE from "three"; import { gsap } from "gsap"; import "./styles.css"; function KLogo() { const group = useRef(); const [dragging, setDragging] = useState(false); useFrame((state, delta) => { if (!group.current) return; if (!dragging) { group.current.rotation.y += delta * 0.35; group.current.rotation.x = THREE.MathUtils.lerp( group.current.rotation.x, Math.sin(state.clock.elapsedTime * 0.55) * 0.18, 0.035 ); } }); return ( { e.stopPropagation(); setDragging(true); }} onPointerUp={(e) => { e.stopPropagation(); setDragging(false); }} onPointerOut={() => setDragging(false)} > {/* Cutout-style dark K face */} {/* pastel side accents */} ); } function Capability({ type, color, title, text }) { const group = useRef(); useFrame((state) => { if (group.current) { group.current.rotation.y = state.clock.elapsedTime * 0.42; group.current.rotation.x = Math.sin(state.clock.elapsedTime * 0.7) * 0.18; } }); return (
{type}
0{type === "AI" ? 1 : type === "WEB" ? 2 : 3}

{title}

{text}

); } const services = [ ["AI Automation", "Agents, workflows, integrations and intelligent business systems."], ["Web Engineering", "Premium interfaces, dashboards and high-performance web platforms."], ["Full-Stack Apps", "Production-ready applications from architecture to deployment."], ["Custom Software", "Purpose-built tools designed around real operational problems."], ["Game Development", "Interactive experiences, mechanics, systems and polished worlds."], ["APIs & Integrations", "Reliable connections between products, services and data."], ]; function App() { const [menu, setMenu] = useState(false); const scrollTo = (id) => { document.getElementById(id)?.scrollIntoView({ behavior: "smooth" }); setMenu(false); }; React.useEffect(() => { gsap.from(".hero-copy > *", { y: 28, opacity: 0, duration: 0.8, stagger: 0.1, ease: "power3.out" }); }, []); return (

SOFTWARE / AI / DIGITAL SYSTEMS

We build digital systems with depth.

Khilji Softwares creates intelligent automation, web platforms, custom software and interactive products for ambitious ideas.

DRAG THE K / EXPLORE DEPTH
AI AUTOMATION · WEB ENGINEERING · FULL-STACK · CUSTOM SOFTWARE · GAME DEVELOPMENT · APIS ·

01 — SERVICES

From idea to working system.

Engineering-led digital products with a clean, modern interface and practical architecture.

{services.map(([title, desc], i) => (
0{i + 1}

{title}

{desc}

↗
))}

02 — 3D CAPABILITIES

Technology you can see.

Actual WebGL scenes, depth, lighting and perspective — not flat cards pretending to be 3D.

03 — ABOUT

Small team mindset.
Serious engineering.

We combine product thinking, modern web engineering and emerging AI capabilities to turn ambitious concepts into useful software.

Every build is designed to be responsive, maintainable and ready to evolve.

04 — PROCESS

Clear thinking. Clean execution.

{["Discover", "Architect", "Build", "Refine", "Launch"].map((x, i) =>
0{i+1}

{x}

Focused decisions, rapid implementation and continuous refinement.

)}

05 — CONTACT

Have a system in mind?

Tell us what you're building. We'll turn the rough idea into a practical next step.

hello@khiljisoftwares.com ↗
); } createRoot(document.getElementById("root")).render();