⚡ DEV.FOLIO — Ultra Dark Portfolio

A brutally modern, animation-heavy developer portfolio built with pure HTML, CSS & JavaScript. Zero frameworks. Zero compromises.

---

✦ Features

• Glitch Typography — Hero text with CSS-only glitch animation on hover loop
• Custom Cursor — Magnetic cursor with smooth trailing effect & hover reactions
• Ambient Orbs — Mouse-parallax background orbs with blur and glow
• Noise + Scanlines — SVG noise texture + CSS scanline overlay for that CRT feel
• Scroll Reveal — IntersectionObserver-powered staggered entrance animations
• Animated Timeline — Experience section with animated dots and slide-in items
• Counter Animation — Stats count up from zero when scrolled into view
• Terminal Block — Fake terminal UI with blinking cursor
• Cyberpunk Clip-Paths — Corner-cut card aesthetic throughout
• Active Nav — Scroll-aware navigation highlighting

---

🎨 Design System

Token	Value	Usage
--bg	#030508	Primary background
--accent	#00ffe7	Cyan — primary accent
--accent2	#ff2d6b	Pink-red — glitch / secondary
--accent3	#7b5cff	Purple — tertiary
--text	#e8eaf0	Body text
--muted	#4a5568	Subdued text

Fonts: Syne (headings) · DM Mono (body) · Space Mono (UI elements)

---

🚀 Getting Started

This is a single-file portfolio — no build step, no npm install, no dependencies.

# Clone
git clone https://github.com/luci01881/portfolio.git

# Open directly in browser
open index.html

# Or serve locally
npx serve .
# or
python -m http.server 8080

---

🌐 Deploy to GitHub Pages

1. Push index.html to the root of your repo
2. Go to Settings → Pages
3. Source: Deploy from a branch → main → / (root)
4. Your site will be live at https://YOUR_USERNAME.github.io/REPO_NAME

---

🔧 Customization

All personal data is in plain HTML — just find and replace:

Placeholder	Replace with
Ufuk Ugur	Your name
Istanbul, TR	Your location
hello@ufukugut.dev	Your email
github.com/luci01881	Your GitHub
linkedin.com/	Your LinkedIn
twitter.com/	Your Twitter / X
Project cards	Your actual projects
Timeline items	Your experience
Stat numbers	Your real numbers

Change the accent color

Edit :root in the <style> block:

:root {
  --accent: #00ffe7;   /* swap to any color */
  --accent2: #ff2d6b;
  --accent3: #7b5cff;
}

---

📁 Structure

portfolio/
└── index.html      # Everything — HTML, CSS, JS in one file

---

⚙️ Browser Support

Browser	Support
Chrome / Edge	✅ Full
Firefox	✅ Full
Safari	✅ Full
Mobile Chrome/Safari	✅ Responsive

---

📄 License

MIT — do whatever you want with it. A star ⭐ is appreciated but not required.

---

Built with obsessive attention to detail · No frameworks · No excuses

· Contact