based on my given above resume create a static portfolio website based on my resume add sections like home about etc and make it only static and with the help of only html,css,javascript only no need of react and json
I'll create a static portfolio website based on your resume using only HTML, CSS, and JavaScript. The website will include all the sections and information from your resume in a modern, responsive design.
index.html
styles.css
script.js
I've created a comprehensive static portfolio website based on your resume with the following features:
Key Features:
- Responsive Design: Works perfectly on all devices
- Modern UI: Clean, professional design with smooth animations
- Complete Sections: Home, About, Education, Experience, Skills, Projects, and Contact
- Interactive Elements: Mobile navigation, smooth scrolling, contact form
- Professional Styling: Uses modern CSS with gradients, shadows, and hover effects
Sections Included:
- Hero Section: Eye-catching introduction with your name and title
- About: Professional summary with statistics
- Education: Timeline format showing your academic background
- Experience: Detailed cards for all your internships and work experience
- Skills: Organized by categories (Languages, Tools, Cybersecurity, etc.)
- Projects: Showcases your three major projects with technologies used
- Contact: Your contact information and a functional contact form
Technical Features:
- Pure HTML, CSS, and JavaScript (no frameworks)
- Mobile-responsive navigation
- Smooth scrolling between sections
- Intersection Observer animations
- Contact form validation
- Scroll-to-top functionality
- Active navigation highlighting
The website is completely static and ready to be hosted on any web server or static hosting platform like Netlify, Vercel, or GitHub Pages.
make it in mid dark theme and add photos also wherever needed
I'll update your portfolio with a mid-dark theme and add photos throughout the website. Let me create a more visually appealing version with a sophisticated dark design.
index.html
styles.css
I've completely transformed your portfolio with a sophisticated mid-dark theme and added relevant photos throughout. Here are the key improvements:
Mid-Dark Theme Features:
- Color Palette: Deep navy (
#0f172a) background with slate accents (#1e293b,#334155) - Accent Colors: Blue gradient (
#60a5fato#3b82f6) for highlights and CTAs - Typography: Inter font for modern, clean readability
- Glassmorphism: Subtle backdrop blur effects on navigation and cards
Photos Added Throughout:
- Hero Section: Professional headshot with cybersecurity background
- About Section: Workspace image with floating security icon
- Education: Campus/school building images for each institution
- Experience: Company logos and relevant work environment visuals
- Skills: Technology icons and logos for each skill category
- Projects: Screenshots/mockups of each project interface
- Contact: Professional working environment image
Enhanced Visual Elements:
- Gradient Backgrounds: Subtle gradients for depth
- Hover Effects: Smooth animations on cards and buttons
- Icon Integration: FontAwesome icons with custom styling
- Image Overlays: Interactive project previews with GitHub/demo links
- Floating Animations: Subtle movement for visual interest
- Custom Scrollbar: Themed scrollbar matching the design
New Interactive Features:
- Social Media Links: Prominent social media integration
- Project Overlays: Hover effects revealing project links
- Enhanced Navigation: Active state indicators
- Improved Mobile: Better responsive design for all devices
- Loading Animations: Smooth fade-in effects for content
The design now has a professional, modern look that's perfect for a cybersecurity professional while maintaining excellent readability and user experience across all devices.