- 34
- 12 005
CodeGenWeb
Sri Lanka
Приєднався 6 вер 2024
Hello, and welcome to CodeGenWeb!
My name is Suraj, and I’m a passionate front-end developer with a love for clean, efficient code and stunning design.
On this channel, you’ll find everything you need to thrive in web development. CodeGen is your go-to resource for mastering HTML, CSS, JavaScript, building Responsive Personal Portfolio Websites, designing Creative Landing Pages, implementing advanced Hover Effects, crafting beautiful CSS Animations, and much more.
Whether you're a beginner or looking to enhance your skills, there's something here for everyone.
Don't forget to Subscribe and hit the notification bell to stay updated with the latest tutorials!
Thank you for joining the CodeGenWeb community!
My name is Suraj, and I’m a passionate front-end developer with a love for clean, efficient code and stunning design.
On this channel, you’ll find everything you need to thrive in web development. CodeGen is your go-to resource for mastering HTML, CSS, JavaScript, building Responsive Personal Portfolio Websites, designing Creative Landing Pages, implementing advanced Hover Effects, crafting beautiful CSS Animations, and much more.
Whether you're a beginner or looking to enhance your skills, there's something here for everyone.
Don't forget to Subscribe and hit the notification bell to stay updated with the latest tutorials!
Thank you for joining the CodeGenWeb community!
Creating A Simple Parallax Website Using HTML and CSS | Travel Website #webdesign #webdevtutorial
Welcome to my latest video where I showcase the hero section of my website featuring a stunning parallax reloading effect! This visual technique creates an immersive experience, adding depth and a smooth, modern feel to your website. Watch as the background and foreground elements shift at different speeds, offering a dynamic browsing experience that engages users from the very first glance.
If you're a web designer or developer, or just someone passionate about modern web design, hit that subscribe button and follow along for more content like this! Let's grow together as we continue building beautiful, responsive websites.
Don't forget to SUBSCRIBE, LIKE, SHARE and put a COMMENT!!
Follow on Git Hub : github.com/codegenweb
Download Resources & Give a star : github.com/codegenweb/ExploreScape-Travel-website
#webdesign #codegenweb #codegen #codegentutorials #webdevtutorial #html #css #javascript #webdevelopment #portfoliowebsite #tutorial #coding #webdesigner #responsivedesign #parallaxeffect #parallax #travel #travelwebsite
web developer,parallax website using html and css,parallax website html css,portfolio website,parallax travel website design,codegenweb,codegen tutorials,website design html css,css animation,web design,travel website,how to create a website using html,web development step by step,parallax scrolling tutorial,parallax scrolling,how to create a parallax scrolling effect,html parallax background,parallax effect css,parallax html,travel website design html css
If you're a web designer or developer, or just someone passionate about modern web design, hit that subscribe button and follow along for more content like this! Let's grow together as we continue building beautiful, responsive websites.
Don't forget to SUBSCRIBE, LIKE, SHARE and put a COMMENT!!
Follow on Git Hub : github.com/codegenweb
Download Resources & Give a star : github.com/codegenweb/ExploreScape-Travel-website
#webdesign #codegenweb #codegen #codegentutorials #webdevtutorial #html #css #javascript #webdevelopment #portfoliowebsite #tutorial #coding #webdesigner #responsivedesign #parallaxeffect #parallax #travel #travelwebsite
web developer,parallax website using html and css,parallax website html css,portfolio website,parallax travel website design,codegenweb,codegen tutorials,website design html css,css animation,web design,travel website,how to create a website using html,web development step by step,parallax scrolling tutorial,parallax scrolling,how to create a parallax scrolling effect,html parallax background,parallax effect css,parallax html,travel website design html css
Переглядів: 786
Відео
Creating A Simple Portfolio Website Using HTML and CSS #webdesign #webdevtutorial
Переглядів 1,5 тис.7 годин тому
Learn how to create a simple portfolio website using HTML and CSS with this easy tutorial. Perfect for beginners in web design and development! Don't forget to SUBSCRIBE, LIKE, SHARE and put a COMMENT!! Follow on Git Hub : github.com/codegenweb Download Resources & Give a star : github.com/codegenweb/Lenna-Portfolio-site #webdesign #codegenweb #codegen #codegentutorials #webdevtutorial #html #c...
Building an Animated Website with HTML & CSS - Step-by-Step Process Part 2
Переглядів 1,7 тис.12 годин тому
Building an Animated Website with HTML & CSS - Step-by-Step Process Part 2 | Contents and Animations Part 1 : ua-cam.com/video/15ka-UfOcfA/v-deo.html Downloads Resources & Give a star: github.com/codegenweb/Save-Water In this video, we dive into the process of building an animated website from scratch using only HTML and CSS. Whether you’re a beginner in web design or looking to sharpen your sk...
Building an Animated Website with HTML & CSS - Step-by-Step Process #webdesign #webdevtutorial
Переглядів 2,3 тис.16 годин тому
Building an Animated Website with HTML & CSS - Step-by-Step Process Part 1 | Creating Navigation Bar Downloads Resources & Watch Part 2 : ua-cam.com/video/eKZUJ1Hv1HE/v-deo.html In this video, we dive into the process of building an animated website from scratch using only HTML and CSS. Whether you’re a beginner in web design or looking to sharpen your skills, this step-by-step guide covers eve...
Simple Animating for the Portfolio Website Using CSS #webdesign #webdevtutorial #animation
Переглядів 91519 годин тому
Learn how to create a simple animation for our portfolio website using HTML and CSS with this easy tutorial. Perfect for beginners in web design and development! Watch How I built this website from scratch : ua-cam.com/video/2wqA3IXz59w/v-deo.html Downloads Resources: www.mediafire.com/file/51cw5gli5yvd0la/RESOURCES - Simple Portfolio site CodeGenWeb Project 2024.zip/file #webdesign #webdevtuto...
STUNNING Glass Button with a Hover Effect! | CSS and HTML | CSS Hover Effect
Переглядів 11621 годину тому
I Created a STUNNING Glass Button with a Hover Effect! | CSS and HTML | CSS Hover Effect Watch me creating a stunning glass button with hover effect. #html #css #webdevelopment #codegen #tutorial #loginform #webdesign #coding #programming #UI #UX #WebDevelopment #ResponsiveDesign #Accessibility #frontend #webdevelopment #tutorial#codegen #webdeveloper #webdesigntutorial #htmltutorial #css #csst...
Creating A Portfolio Website Using HTML and CSS #webdesign #webdevtutorial
Переглядів 1,5 тис.День тому
Learn how to create a stunning portfolio website using HTML and CSS with this easy tutorial. Perfect for beginners in web design and development! Check Live website : codegenweb.github.io/Hannah-Personal-Portfolio Download Source : github.com/codegenweb/Hannah-Personal-Portfolio #webdesign #webdevtutorial #html #css #javascript #webdevelopment #portfoliowebsite #tutorial #coding #webdesigner #r...
CSS NavBar with Underline Link Hover Effect | CSS Menu Hover Effect | Navigation Bar
Переглядів 127День тому
CSS NavBar with Underline Link Hover Effect | CSS Menu Hover Effect | Navigation Bar #webdesign In this video, I’ll show you how I create this clean and simple navigation bar link underline hover effect using just HTML and CSS. Whether you're new to web development or looking to enhance your coding skills, this video is perfect for you. Follow along as we build the navigation bar that you can e...
How to create a Simple Navigation Bar using HTML and CSS | No JavaScript #webdevelopment #navbar
Переглядів 3521 день тому
How to create a Simple Navigation Bar using HTML and CSS | No JavaScript #webdevelopment #navbar
How to make Login Form using CSS and HTML
Переглядів 13821 день тому
How to make Login Form using CSS and HTML
How to Create a Navigation Bar only using HTML and CSS | Beginner Guide
Переглядів 4221 день тому
How to Create a Navigation Bar only using HTML and CSS | Beginner Guide
How to create a Simple Navigation Bar using HTML and CSS | No JavaScript #webdevelopment #navbar
Переглядів 3721 день тому
How to create a Simple Navigation Bar using HTML and CSS | No JavaScript #webdevelopment #navbar
Simply Create Eye-Catching Neon Text Effects with HTML & CSS
Переглядів 1421 день тому
Simply Create Eye-Catching Neon Text Effects with HTML & CSS
Simply Coding the Facebook Follow Button with CSS & HTML | Step-by-Step Tutorial #html #css
Переглядів 2121 день тому
Simply Coding the Facebook Follow Button with CSS & HTML | Step-by-Step Tutorial #html #css
Simply Coding 2024 Modern YouTube Subscribe Button with HTML & CSS | Step-by-Step Tutorial
Переглядів 4921 день тому
Simply Coding 2024 Modern UA-cam Subscribe Button with HTML & CSS | Step-by-Step Tutorial
Simply Coding the YouTube Subscribe Button with HTML & CSS | Step-by-Step Tutorial
Переглядів 5328 днів тому
Simply Coding the UA-cam Subscribe Button with HTML & CSS | Step-by-Step Tutorial
Simply Create Eye-Catching Neon Button Hover Effects with HTML & CSS
Переглядів 13928 днів тому
Simply Create Eye-Catching Neon Button Hover Effects with HTML & CSS
CSS Glowing Button: How to Make a Glowing Button with Hover Effect | Pure CSS & HTML
Переглядів 37Місяць тому
CSS Glowing Button: How to Make a Glowing Button with Hover Effect | Pure CSS & HTML
Welcome to CodeGen! | My Web Development Journey | From Beginner to Pro | Starts Today
Переглядів 132Місяць тому
Welcome to CodeGen! | My Web Development Journey | From Beginner to Pro | Starts Today
your work is amazing am gona give you a like ans subscribe could you please also do a zoom parallax
Thank you friend! yeah sure I'll make a video soon!
How can its make responsive?
I'll make a video about it.
How tf are you not getting views, You deserve a million bro 🙌🏻
Thank you friend!! much appreciate your support!
nice work I like it I need contact you
Thank you! Find me on Facebook ---> codegenweb
Hi! Every time I say to myself "oh how stylish! Hard to do better" and every time it's even better! 🤯🙏
good luck friend!! ❤❤
Don't forget to SUBSCRIBE, LIKE, SHARE and put a COMMENT!! Follow on Git Hub : github.com/codegenweb
from where did you learn html,css and what other technologies have you learned…can you plz share resources from where you learn
ok, sure!!
Hi, how long have you been coding to know how to do all this? It's really motivating for a beginner like me! Did you learn alone or in school? Thanks for this video!
@@Paradoxe45470 I’m self learner, and still learning. It was 2-3 months.
@@codegenweb Waaaa, okay thank you very much! It motivates!
Awesome
@@CodeVerseLab4 thank you !
Can't wait to witness this
<..😇❤..>
great
Thank you!
Damn , it's so hood
Thank You!!
Bro how to get these types of designs?
images??
@@codegenweb no design means UI
@@codegenweb did you create design on your own? Means UI like in figma Or any other
@@Iopnotyouopiop Ah, yeah figma + ps.
@@codegenweb nice
Live Website: codegenweb.github.io/Lenna-Portfolio-site/ Don't forget to SUBSCRIBE, LIKE, SHARE and put a COMMENT!!
Beautiful 😮 How long have you been coding for to get an idea of what I might want? Thx for this !
Thank you!
Can you make a take showing the codes in more detail? Your video is really good, but I think I got a little lost at some points.
Thank you! Check the source code if you got lost. Downloads Resources : www.mediafire.com/file/gvewtdj1irdczhw/Resources__-_Save_Water_CodeGen_Project.zip/file
@@codegenweb omg thank you very much, you helped me a lot with my school work!! I hope your channel can grow a lot and help more people like me
Thank you very much
Thank you!
Need source code😢
Watch Part 2 & Download Resources : ua-cam.com/video/eKZUJ1Hv1HE/v-deo.html
Full html and css course?
Sure!!
creepy
Good day! Please share img files!
Watch Part 2 & Download Resources : ua-cam.com/video/eKZUJ1Hv1HE/v-deo.html
Watch Part 2 & Download Resources : ua-cam.com/video/eKZUJ1Hv1HE/v-deo.html SUBSCRIBE the channel and stay connected!
Hi, Thanks for this very handy course. please upload source code to develop our code better :)
we are working on it, All resources will be updated soon! Thank You!!
Updated!! Watch Part 2 & Download Resources : ua-cam.com/video/pzqUuOeSUII/v-deo.html
The music is annoying but the work is great
Thank you for the feedback, we will work on it.
Hello, I learning code for fun and potential futur, and thanks for help real New 👌👌
Glad to hear that!! Thank you!
Nice dude keep it up ❤
Thank you!
bg is quite annoying
Thank you for the feedback, we will work on it.
Bruh i ask you u give me source code???
we working on it, All recourses will be updated soon!
Watch Part 2 & Download Resources : ua-cam.com/video/pzqUuOeSUII/v-deo.html Check Live website : codegenweb.github.io/Hannah-Personal-Portfolio/ SUBSCRIBE the channel and stay connected!
Watch How I built this website from scratch : ua-cam.com/video/2wqA3IXz59w/v-deo.html Check the Description For Downloads
nah
@@zombozo1750 💀💀💀
I wonder where “hire me” points to
Great question! The 'Hire Me' button points to contact page, where clients can easily reach out for collaborations or hire for web design projects. Alternatively, also we can add options for direct emailing or linking to any freelancing profile. Thanks for watching! Watch Animation part of this website: ua-cam.com/video/pzqUuOeSUII/v-deo.html
Plz source code plz
Thanks for watching! ❤ We'll upload it soon! stay tuned!
very nice👌
Thanks for watching! ❤ Watch Animation part of this website: ua-cam.com/video/pzqUuOeSUII/v-deo.html
awesome tysm
Thank you!
Can't we do it with a href?
yes, we can use href, like this. <li> <a href="link"> Home </a> </li>
How to create a Simple Navigation Bar using HTML and CSS In this video, I’ll show you how I create this clean and simple navigation bar using just HTML and CSS. Whether you're new to web development or looking to enhance your coding skills, this video is perfect for you. Follow along as we build the navigation bar that you can easily integrate into your website. 🔵 What you'll learn: How to structure a navigation bar using HTML Basic CSS styling for the navigation links Hover and Click Effects Don't forget to like, comment, and subscribe! Let’s learn web development together! 🚀
n this video, I'll guide you step-by-step through creating a clean and simple login form using CSS and HTML. Perfect for beginners, this tutorial covers key design elements and layout tips to help you build stylish login pages for your websites. Whether you're just starting out or enhancing your web design skills, join me to learn how to make functional and visually appealing forms!
How to create a Simple Navigation Bar only using HTML and CSS In this video, I’ll show you how I create this clean and simple navigation bar using just HTML and CSS. Whether you're new to web development or looking to enhance your coding skills, this video is perfect for you. Follow along as we build the navigation bar that you can easily integrate into your website. 🔵 What you'll learn: How to structure a navigation bar using HTML Basic CSS styling for the navigation links Hover and Click Effects Don't forget to like, comment, and subscribe! Let’s learn web development together! 🚀
How to create a Simple Navigation Bar using HTML and CSS In this video, I’ll show you how I create this clean and simple navigation bar using just HTML and CSS. Whether you're new to web development or looking to enhance your coding skills, this video is perfect for you. Follow along as we build the navigation bar that you can easily integrate into your website. 🔵 What you'll learn: How to structure a navigation bar using HTML Basic CSS styling for the navigation links Hover and Click Effects Don't forget to like, comment, and subscribe! Let’s learn web development together! 🚀
Learn how to create stunning neon text effects with HTML and CSS. In this tutorial, we'll guide you through the step-by-step process of designing eye-catching neon text elements. From setting up the basic structure to adding vibrant colors and glows, we'll cover everything you need to know.
Button ke andar link keise lagaue
you can use <a> tag to put a link or can use JavaScript also. <a href="put link here" class="button"> Subscribe </a>
In this video, I’ll walk you through the process of coding a custom Facebook Follow button using only HTML and CSS. Whether you’re a beginner or looking to enhance your web design skills, this simple and easy-to-follow guide will help you create a functional and stylish button for your projects. What you'll learn: How to structure a Facebook Follow button with HTML Applying CSS to style the button with hover effects Let’s dive into coding and add some professional touches to your web designs! 🚀
How to Create Modern UA-cam Subscribe Button with HTML & CSS | Step-by-Step Tutorial As a beginner in web development, I’ve just learned how to create a UA-cam Subscribe button using only HTML and CSS. I’m excited to share this step-by-step tutorial with you so we can learn together! In this video, I’ll walk you through the process of building a simple yet effective subscribe button-perfect for adding to your website or UA-cam channel page. No JavaScript required, just clean and straightforward HTML and CSS. What you’ll see: How I structured the button in HTML The CSS styling I used to make it stand out Simple hover effects to make it interactive Join me on my journey as I continue learning and growing as a web developer. Let’s build something cool together! #CodeGen #webdevelopment #webdesign #webdeveloper #webdesigntutorial #coding #html #htmltutorial #css #csstutorial #javascript #javascripttutorial #bootstrap #ui #ux #uiux #uxdesign #responsivewebsite #hovereffects #hoverbutton #css
In this video, I’ll walk you through the process of building a simple yet effective subscribe button-perfect for adding to your website or UA-cam channel page. No JavaScript required, just clean and straightforward HTML and CSS. What you’ll see: How I structured the button in HTML The CSS styling I used to make it stand out Simple hover effects to make it interactive Join me on my journey as I continue learning and growing as a web developer. Let’s build something cool together! #CodeGen #webdevelopment #webdesign #webdeveloper #webdesigntutorial #coding #html #htmltutorial #css #csstutorial #javascript #javascripttutorial #bootstrap #ui #ux #uiux #uxdesign #responsivewebsite #hovereffects #hoverbutton #css
In this tutorial, you'll learn how to create eye-catching neon button hover effects using just HTML and CSS. Perfect for beginners, this step-by-step guide will show you how to add vibrant, interactive buttons to your website without any JavaScript. By the end of this video, you'll be able to create glowing buttons that not only look stunning but also enhance user experience. Let's dive in and make your web designs stand out! Key topics covered: 1. Basic Button Structure: Learn how to set up the foundation for your neon buttons using HTML elements. 2. CSS Styling: Discover how to apply styles to create the neon look, including background color, borders, and text properties. 3. Hover Effects: Add dynamic behavior to your buttons, such as changing color, size, or incorporating a glow effect.
Learn how to create a simple glowing button with hover effects using only CSS and HTML. No JavaScript required! It’s easy to follow and perfect for beginners-just simple steps that anyone can follow. Key points covered: Basic HTML structure for a button Applying CSS styles for a glowing effect Creating a hover effect for added interactivity Let's get started and make your buttons shine!" Don't forget to take a second to show some love - SUBSCRIBE, LIKE, and SHARE!
Welcome to CodeGen! | My Web Development Journey | From Beginner to Pro | Starts Today I’m just starting my journey into web development, and I’m excited to share my growth with you. On this channel, you’ll see me learning and building websites from scratch, with screen recordings and time-lapse videos capturing every step. Whether it’s mastering CSS, HTML, JavaScript, or designing beautiful websites, we’ll learn together, grow together, and create together. If you’re also new to web development or just want to follow along, join me on this exciting adventure. Let’s code for a new era-together! #CodeGen #webdevelopment #webdesign #webdeveloper #webdesigntutorial #coding #html #htmltutorial #css #csstutorial #javascript #javascripttutorial #bootstrap #ui #ux #uiux #uxdesign #responsivewebsite