Build a Curvaceous Homepage // Wavy Background Tutorial with SVG & CSS

Build a Curvaceous Homepage // Wavy Background Tutorial with SVG & CSS

Fireship

3 года назад

1,090,317 Просмотров

Ссылки и html тэги не поддерживаются


Комментарии:

@kenshinleronin2193
@kenshinleronin2193 - 09.07.2024 11:41

we can't do this waves effect on the second section ? That work only with the background color ? Because i try to correspond my section 1 and section 2 and that doesnt work only the before work

Ответить
@annekaushal314
@annekaushal314 - 12.06.2024 08:12

Bro didn't put his files inside src folder 💀💀💀💀 seriously why tho??

Ответить
@Quantwan
@Quantwan - 24.05.2024 10:45

How do you have the html5 icon as file icon?

Ответить
@biruktad3327
@biruktad3327 - 11.05.2024 18:13

Wow! This helps me break many dev territories. 'SVG made easy' would be a proper title. Thx.

Ответить
@CobraunieSC
@CobraunieSC - 08.04.2024 12:53

THANK YOU BECAUSE OF YOU I AM NOW A LVL 2 DESIGNER

Ответить
@pogsicle7453
@pogsicle7453 - 28.03.2024 05:54

Why's it usually bad to create empty divs?

Ответить
@whybeproduction4106
@whybeproduction4106 - 10.03.2024 00:18

You made the best video ever created about teaching and explaining something 😂🤜🏽🤛🏽

Ответить
@cocadoodledoo6346
@cocadoodledoo6346 - 07.03.2024 19:06

Dang fireship used to make actual 10+min guides. 😅

Ответить
@mariomodulor2190
@mariomodulor2190 - 05.03.2024 06:14

Thank you! This video saved my life!

Ответить
@cesarzaitoun1129
@cesarzaitoun1129 - 19.02.2024 15:04

This is awesome i have used it in my portfolio, thank you so much 👍

Ответить
@zeke2269
@zeke2269 - 28.01.2024 16:24

how to make it reponsive ? the height...

Ответить
@avertry9529
@avertry9529 - 09.01.2024 16:22

Instead of Cue-Tey why not Cute as in Kute, some great ideas, thanks

Ответить
@For-The-Humans
@For-The-Humans - 29.12.2023 06:24

I'm not sure this animation works anymore, I did everything and it's still not working.

Ответить
@user-jx2qs6rk4h
@user-jx2qs6rk4h - 19.12.2023 07:42

on the first example why we need to display block even the are postioned absolute i mean how things work here i dont get it when the curve after and curve before is display block they are float to left and if not the float to right why is that i get that because of the are postioned absolute the didnt respect lay out but why did the float to right when there is no display block and to left when there is, and i mean this before using any transform property pls explain

Ответить
@solorunner98
@solorunner98 - 16.12.2023 22:11

Damn it.
I want to be this good.

Ответить
@ernerooo
@ernerooo - 29.11.2023 17:16

Yeah, Kurwaceous Homepage...

Ответить
@aryansoni9150
@aryansoni9150 - 25.11.2023 03:58

I followed and made this myself and it works and looks beautiful, thanks jeff

Ответить
@Gust8
@Gust8 - 15.11.2023 19:50

I need coding course for free im 11

Ответить
@vishnupadmakumar5945
@vishnupadmakumar5945 - 15.11.2023 16:44

hi how did u get the cdn link for the script tag? i am a beginner

Ответить
@ilirbajrami2902
@ilirbajrami2902 - 02.11.2023 12:32

Can't find the "G"... element!

Ответить
@gundamkw1095
@gundamkw1095 - 18.10.2023 17:51

I want to know what you mean in the end, that it Will easier using figma tool? I know figma, but i don't know how to implement what you said using figma.

Ответить
@billycroacker
@billycroacker - 03.10.2023 18:51

Thank you man, this video was amazing 👍 I subscribed without blinking after watching this.

Ответить
@Zeph504
@Zeph504 - 03.10.2023 11:02

Not only you teach us how to make curve, you also gave a tip for making my life easier. you earn more subscriber

Ответить
@thechoosen4240
@thechoosen4240 - 05.09.2023 20:44

Good job bro, JESUS IS COMING BACK VERY SOON; WATCH AND PREPARE

Ответить
@ankibha203
@ankibha203 - 03.09.2023 13:11

Searching for something..to learn about waves to create them.. found you.. n its helpful. Thanks man 😊

Ответить
@eliasrayan6421
@eliasrayan6421 - 20.08.2023 16:16

Hi ! Thanks for the content. I don't mean to be ungrateful, but why does this video feel like a speedrun ? I couldn't reproduce the design while watching the video (even after pausing it many times) because you didn't show the output often enough.

Ответить
@sabuein
@sabuein - 16.08.2023 00:46

Thank you

Ответить
@PeenDrive
@PeenDrive - 08.08.2023 18:57

I forgot why I subscribe to the channel, now i rebember

Ответить
@shafnisha1171
@shafnisha1171 - 05.08.2023 21:17

I use Haikei designs instead!

Ответить
@jeremykenn
@jeremykenn - 01.08.2023 04:26

i can't do vertical scroll if i add overflow:hidden in the body, is there any workaround ?

Ответить
@AG-ur1lj
@AG-ur1lj - 29.07.2023 11:19

In my text editor, I just make the section, h1, and p tags then press `SHIFT+V, 4K, ESC, 8P`

Ответить
@techs7296
@techs7296 - 28.07.2023 10:47

I like curvy gorgeuis girl more than dev coding.

Ответить
@theFriendlyGhst
@theFriendlyGhst - 25.07.2023 03:53

I like my website like i like my women...

Ответить
@parrySc
@parrySc - 22.07.2023 06:43

You are my #1 content creator. What a beast!!

Ответить
@JoshuaClancy12
@JoshuaClancy12 - 13.07.2023 05:56

section 8? really??

Ответить
@theshelbypalace
@theshelbypalace - 12.07.2023 08:13

this is amazing!!!!! Thank you!! new subscriber! 🥳

Ответить
@yardenlevykislev1709
@yardenlevykislev1709 - 12.07.2023 02:00

Why this doesnt work in svelte

Ответить
@paulhetherington3854
@paulhetherington3854 - 12.06.2023 20:35

<html> = curved pulse - BPM

Ответить
@tenebrae1191
@tenebrae1191 - 12.06.2023 20:00

👏👏

Ответить
@alexandercorfiant1873
@alexandercorfiant1873 - 10.06.2023 21:35

I tried to use the first approach with CSS, but your solution and code do not work. It is a pity. Please be so kind as to revise your video

Ответить
@kinglytical
@kinglytical - 29.05.2023 07:04

i cant open the command line, can anyone help me? thanks

Ответить
@benjamingaller3537
@benjamingaller3537 - 24.05.2023 21:18

little tip for everyone who struggles with the background on a wqhd/UHD or mobile screen, set heigth to 100vh.

Ответить
@XxbankerboomxX
@XxbankerboomxX - 23.05.2023 00:44

An easy method to adjust those circles is to use the chrome css dev tools and drag the translate property and preview it visually

Ответить
@xxXXuser69420XXxx
@xxXXuser69420XXxx - 20.05.2023 17:42

font-family: 'Prompt'
Foreshadowing right there

Ответить
@princewillchukwujama1199
@princewillchukwujama1199 - 19.05.2023 01:40

3 min into the vid I subbed, thank you brother

Ответить
@GunjanShrimali
@GunjanShrimali - 12.05.2023 17:12

I'm full with the confidence in less time very helpful video

Ответить
@rolane-softwares
@rolane-softwares - 10.05.2023 13:53

how r u picking the theme colors

Ответить
@sachinpandey7751
@sachinpandey7751 - 05.05.2023 09:30

thanlyou thankyou so much

Ответить