-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
141 lines (135 loc) · 5.91 KB
/
index.html
File metadata and controls
141 lines (135 loc) · 5.91 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aryan Kumar | Developer, Designer, Creator and Entrepreneur</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="blur-circle"></div>
<div class="background"></div>
<div class="container">
<nav class="navbar">
<a id="logo" href="#">Portfolio</a>
<a href="#">About</a>
<a href="#">Projects</a>
<a href="#">Skills</a>
<a href="#">Services</a>
<a href="#" class="btn" id="nav-contact">Contact →</a>
</nav>
<section class="hero">
<div class="hero-text">
<h1>Hello, I'm Aryan.</h1>
<p>Bring Life to your Ideas with My Expertise</p>
<a href="#" class="btn">View Projects</a></div>
<div class="heroimg"><img src="pfp1.png" alt=""></div>
</section>
<section class="projects">
<h2>My Projects</h2>
<div class="project-grid">
<div class="card">
<h3>Discord Clone</h3>
<p>(Future Project)</p>
<p>A web-based replica of Discord’s user interface, built with HTML, CSS, and JavaScript, designed to recreate the platform’s familiar chat experience.</p><p>This project includes real-time chat simulations, multiple channels, and user-friendly message displays.</p>
<p>Technologies:<ul><li>HTML, CSS, JavaScript</li><li>Backend: Simulated backend functionality with JavaScript or Node.js for real-time interactions.</li><li>Features: Real-time chat simulation, responsive layout, channel management, dynamic UI elements.</li></ul></p>
<a href="#" class="btn">View Project</a>
</div>
<div class="card">
<h3>Blinkit Clone</h3>
<p>(Future Project)</p>
<p>A front-end clone of Blinkit, capturing the essential components of an e-commerce and delivery application interface.</p><p>Designed with HTML, CSS, and JavaScript, this project simulates a user-friendly online shopping experience with elements like product listings, categories, cart previews, and checkout flows.</p>
<p>Technologies:<ul><li>HTML, CSS, JavaScript</li><li>Backend: Simulated cart and checkout flows with JavaScript</li><li>Features: Product listing pages, category navigation, shopping cart functionality, and responsive design.</li></ul></p>
<a href="#" class="btn">View Project</a>
</div>
<div class="card">
<h3>Cryptocurrency Wallet</h3>
<p>(Future Project)</p>
<p>A cryptocurrency wallet interface designed for tracking and managing digital assets, created using HTML, CSS, JavaScript, and Python.</p><p>This project showcases a modern wallet interface where users can view their cryptocurrency balances, track price trends, and simulate transactions.</p>
<p>Technologies:<ul><li>HTML, CSS, JavaScript, Python</li><li>Backend: Python (data management and potential API integrations)</li><li>Features: Real-time balance display, simulated transaction functionality, interactive price charts, and secure wallet management interface.</li></ul></p>
<a href="#" class="btn">View Project</a>
</div>
</div>
</section>
<h2>My Skills</h2>
<section class="skills">
<div class="skill-list">
<div>Figma</div>
<div>HTML</div>
<div>CSS</div>
<div>Javascript</div>
<div>Photoshop</div>
<div>Adobe Illustrator</div>
<div>Premiere Pro</div>
<div>Da Vinci Resolve</div>
<div>Python</div>
</div>
</section>
<section class="services">
<h2>My Services</h2>
<div class="service-grid">
<div class="sc-container">
<div class="service-card">
<h3>UI/UX Design</h3>
<p>Crafting intuitive and engaging interfaces that prioritize user experience, from concept to final design.</p>
</div>
</div>
<div class="sc-container">
<div class="service-card">
<h3>Web-Development</h3>
<p>Building responsive, high-performance websites with clean, scalable code that brings designs to life.</p>
</div>
</div>
<div class="sc-container">
<div class="service-card">
<h3>Video Editing</h3>
<p>Creating dynamic video content with seamless edits, transitions, and effects that captivate audiences.</p>
</div>
</div><div class="sc-container">
<div class="service-card">
<h3>Graphic Design</h3>
<p>Designing visually striking graphics that communicate brand messages and captivate viewers.</p>
</div>
</div><div class="sc-container">
<div class="service-card">
<h3>Branding</h3>
<p>Developing cohesive brand identities that resonate with your audience and convey your unique vision.</p>
</div>
</div><div class="sc-container">
<div class="service-card">
<h3>AI Chatbots</h3>
<p>Implementing AI-powered solutions to enhance functionality, automate processes, and deliver smarter experiences.</p>
</div>
</div>
</div>
</section>
<section class="contact">
<div>
<h2>Quick Links</h2>
<div>
<ul>
<li><a href="">Home</a></li>
<li><a href="">Projects</a></li>
</ul>
<ul>
<li><a href="">Skills</a></li>
<li><a href="">Services</a></li>
</ul></div>
</div>
<div>
<h2>Get in Touch</h2>
<div>
<img src="linkedin.png" alt="">
<img src="github.png" alt="">
<img src="insta.png" alt="">
<a href="#" class="last-btn">Connect with Me →</a>
</div>
</div>
</section>
</div>
<footer>
<p>© Aryan's Portfolio. All rights reserved.</p>
</footer>
<script src="script.js"></script>
</body>
</html>