CSS tutorial, but it has to rhyme

Поделиться
HTML-код
  • Опубликовано: 9 сен 2024
  • CHECK OUT APPWRITE: apwr.dev/hyper... [$50 in free Pro credits]
    FONT AWESOME ICONS: bit.ly/3WQHEoJ [Affiliate link]
    ORIGINAL EFFECT: bit.ly/3AbKjAx
    MY RECREATION: bit.ly/3WVlnXa

Комментарии • 521

  • @Hyperplexed
    @Hyperplexed  Месяц назад +145

    CHECK OUT APPWRITE: apwr.dev/hyperplexed50 [$50 in free Pro credits]
    FONT AWESOME ICONS: bit.ly/3WQHEoJ [Affiliate link]
    ORIGINAL EFFECT: bit.ly/3AbKjAx
    MY RECREATION: bit.ly/3WVlnXa
    Thanks for watching!!

    • @Jonathan_Wen
      @Jonathan_Wen Месяц назад +4

      Too many rhymes can make our brain go inane...

    • @Obedthian-UK
      @Obedthian-UK 16 дней назад

      I thought the title said cs

    • @yoriichitsugikuni2000
      @yoriichitsugikuni2000 14 дней назад

      try copying something from here:- nohello.net/en/ and the animations from ASUS ROG ZEPHYRUS DUO LAPTOP SHOWCASE page

    • @lightning_11
      @lightning_11 14 дней назад

      Outstanding job!!

    • @Pawlo370
      @Pawlo370 13 дней назад

      1:24

  • @caseycodes
    @caseycodes Месяц назад +2977

    whatever appwrite paid you, it wasn't enough.

  • @aqua-bery
    @aqua-bery Месяц назад +1611

    Every time you do something like this i am left hyperplexed

    • @rafaelschesschannel7404
      @rafaelschesschannel7404 Месяц назад +7

      He left me hyper_perplexed

    • @moritz584
      @moritz584 Месяц назад +12

      @@rafaelschesschannel7404 wow, what a coincidence that this is the creator‘s name!! Someone should make a joke about that

    • @poleve5409
      @poleve5409 21 день назад +6

      ​@@rafaelschesschannel7404aqua berry's joke but worse

  • @NickAc
    @NickAc Месяц назад +1076

    damn that sponsor spot was fire

    • @AmaroqStarwind
      @AmaroqStarwind Месяц назад +18

      But everything changed when the fire nation attacked

    • @rowboat10
      @rowboat10 Месяц назад +8

      his rhyming ability leaves me inspired

    • @Appwrite
      @Appwrite Месяц назад +4

      I agree

    • @Appwrite
      @Appwrite Месяц назад +1

      @@AmaroqStarwindfire nation who?

    • @ignestr
      @ignestr 18 дней назад

      @@rowboat10the wordplay at hand is very admired

  • @roganl
    @roganl Месяц назад +563

    Wouldn't you know it, we've found a code poet.

    • @dratini1247
      @dratini1247 Месяц назад +2

      BARZ 🔥

    • @unstablecoding
      @unstablecoding Месяц назад +3

      That half rhyme go crazy!!

    • @TheBcoolGuy
      @TheBcoolGuy Месяц назад +3

      coet

    • @_normal.boi_
      @_normal.boi_ 18 дней назад

      i was just about to comment that!

    • @mathguy37
      @mathguy37 День назад

      haven't seen someone combine the two
      i can certainly say the experience is new

  • @nikolabosevski1435
    @nikolabosevski1435 Месяц назад +561

    One of the rare times i watched though the ad. At first i didnt even realise it was an ad, thats how good it was done

    • @ego-lay_atman-bay
      @ego-lay_atman-bay Месяц назад +10

      The only reason I realized it was an ad immediately, was because I saw the sponsorblock skip sponsor button show up.

    • @nikolabosevski1435
      @nikolabosevski1435 Месяц назад

      @@ego-lay_atman-bay a fellow youtube premium apk enjoyer i see 😂

    • @ego-lay_atman-bay
      @ego-lay_atman-bay Месяц назад

      @@nikolabosevski1435 um... I use revanced...

    • @Appwrite
      @Appwrite Месяц назад +6

      @@ego-lay_atman-bayyes but did you watch??

    • @ego-lay_atman-bay
      @ego-lay_atman-bay Месяц назад +5

      @@Appwrite yes

  • @ukriu
    @ukriu Месяц назад +353

    Here are the lyrics:
    [Intro]
    Whenever I see an effect and feel that I know it's creator is quite the real deal,
    I'll first try to see if I too can attain it,
    and then make a video to try to explain it.
    With one single goal,
    to take a complex thing and break it into pieces that aren't so perplexing.
    We just need a starting point, it doesn't matter where; an icon, a color, or in this case a square.
    [Start]
    The first thing it needs are a size and a border.
    The R, G and B would come next in the order,
    And I suppose we should cover how it looks when we hover.
    Here there's a few different things to discover,
    you've probably guessed that there's a transition from hidden to a more visible condition.
    To that I would offer one single correction,
    that we forgot to consider the mouse's direction.
    While on the way out it's slow and consistent,
    on the way in, the change should be *instant.*
    With this singular tile we've laid the foundation;
    Paving the way for some more explanation.
    [Sponser Segment]
    But first I'll extend you a swift invitation,
    And believe me, I have some good information.
    If you need a quick way to build applications from a database layer to authentication,
    I'd recommend `appwrite` with no hesitation.
    Their service is quite an impressive creation,
    What's that you hail from the `Firebase` Nation?
    No worries, their wizards and easy migration.
    From here I'll extend you my recommendation,
    to give them a try with a quick registration.
    [Start again]
    We've made it this far that much is clear,
    but somehow we still need to make our way here.
    Say that we wanted our grid ten by ten,
    we could copy our tile again and again.
    But I think I want the lazy solution,
    a function could do it with one execution.
    A line of code each for the tile and container,
    and the `for` loop here will complete the remainder.
    A few steps inside is all that we'll do,
    cloning is one and depending is two.
    Though a singular tile was fine before,
    our loop is giving us ninety-nine more.
    Right about now you might be discovering,
    each of our tiles has the same coloring.
    To pick out a few we'll use an inspector,
    then bury each one with the nth child selector.
    While a repeatable pattern is certainly practical,
    I think the randomness could be more maximal.
    One thing I learned is that patterns are stackable;
    No need to be perfect, just make sure they're passable.
    Now why don't we look and see what we've missed?
    The icons are probably topping the list.
    Font Awesome is usually the place that I go (affiliate link in description below).
    When I need a pattern, at least one that's repeatable,
    I'd typically say a design tool is unbeatable.
    But CSS backgrounds are auto repeated,
    so thats not the step that we need completed.
    We can change the size here, thats all perfectly fine.
    The real issue however is in how they align.
    Since there isn't a property to spread them apart,
    maybe the icon is a good place to start.
    See the image itself will keep its dimension.
    It's the icon inside that needs our attention.
    Now we just simply take our revision and line it back up in the proper position.
    What we are left with is a straightforward objective,
    a little rotation and an adjusted perspective.
    You could opt to use the original as reference,
    it's really just a matter of personal preference.
    After we add some more columns and rows, we could layer a gradient on top I suppose.
    But I don't really have a rhyme for the close,
    ehh I'll just give you a boop on the nose.
    *_boop_*

    • @arafays
      @arafays Месяц назад +10

      the paragraph guy!!!

    • @DatGamer56
      @DatGamer56 Месяц назад +6

      the boop is the best part

  • @anon_y_mousse
    @anon_y_mousse Месяц назад +182

    It only makes it more perfect that the runtime is 3:14.

  • @Aminsx_
    @Aminsx_ Месяц назад +44

    This is the first time i actually liked hearing an ad

  • @socalminstrel
    @socalminstrel Месяц назад +94

    Usually long-form rhyming like this tends to be really bad, as the person makes huge stretches to find a rhyme. You made it sound very natural and the flow was great. To do that in addition to explaining a cool effect is incredibly impressive!

  • @sobanejaz
    @sobanejaz Месяц назад +205

    I think bro was video editing avengers movie on side hustle

  • @eyalb8421
    @eyalb8421 Месяц назад +109

    I love your style of videos, and how you avoid making web dev tedious! I haven't seen such an innovation, since fireship brought us an explanation! I truly appreciate your creation, and hope this money gives you a bit of motivation

    • @shalunu
      @shalunu Месяц назад +4

      W comment

    • @_nahwhat
      @_nahwhat 13 дней назад +2

      What currency is that?

    • @eyalb8421
      @eyalb8421 13 дней назад

      @@_nahwhat pog money

    • @_nahwhat
      @_nahwhat 13 дней назад

      @@eyalb8421 👍

    • @Hnagd
      @Hnagd 9 дней назад

      @@eyalb8421 How is it like in Israel/Palestine right now? (Yes I spent time figuring out what it is. For people who want to know, it's the Israeli new shekel ₪. Officially Israel uses it, but its unofficially used in Palestine too. Please don't make this political.)

  • @zyansheep
    @zyansheep Месяц назад +86

    Auto skipped the ad, but then went back to watch it because I realized it would probably be rhymed

    • @Appwrite
      @Appwrite Месяц назад +19

      Good 😈

    • @wyndmill
      @wyndmill 26 дней назад +1

      @@Appwrite aint no way

    • @Appwrite
      @Appwrite 26 дней назад +10

      @@wyndmill Way

    • @torchy_
      @torchy_ 22 дня назад +2

      @@Appwrite holy crap its appwrite

    • @AndyGneiss
      @AndyGneiss 14 дней назад

      @@Appwrite You have a good spokesperson here; I now hold this video quite dear. I hope your support let's them continue, and that they help you keep quite a retinue.

  • @LeekTech
    @LeekTech Месяц назад +144

    Wow 😮 Dr Seuss would be proud 😂

  •  Месяц назад +39

    Your rhymes were smooth, and the tutorial's tight,
    Teaching CSS in a way that's just right.
    From squares to borders and transitions galore,
    You made complex things something to explore.
    The way you break it down, it's easy to see,
    You've got the knack for simplicity.
    I'll take these tips and put them to use,
    With your rhymes, coding's no longer obtuse!
    Thanks for the lesson, it's truly a gem,
    I'll be back for more-don't know when, but then!

  • @DennisIvy
    @DennisIvy Месяц назад +44

    I'm always blown away when I watch a Hyperplexed video 😲

    • @jmg9509
      @jmg9509 Месяц назад +6

      You mean to say, you're hyperplexed?

    • @DennisIvy
      @DennisIvy Месяц назад +1

      @@jmg9509😉

  • @Nameless-hu-bro
    @Nameless-hu-bro Месяц назад +13

    The only sponsor portion where I clicked on "Unskip" and enjoyed it.

    • @Appwrite
      @Appwrite Месяц назад +7

      And you are better off now because of it 😉

    • @CubicMathTime
      @CubicMathTime 15 дней назад +1

      @@AppwriteNO WAY

  • @thecrazymoon6578
    @thecrazymoon6578 Месяц назад +100

    0:07 did you just rhyme "it" with "it"?

    • @abail7010
      @abail7010 Месяц назад +30

      No, „attain it“ with „explain it“

    • @Izackthestickman
      @Izackthestickman 24 дня назад +12

      @@abail7010yeah so he rhymed it with it???

    • @Somebodyherefornow
      @Somebodyherefornow 23 дня назад +12

      ⁠@@IzackthestickmanNO
      he rhyped attain with explain
      or -ain-it- with -ain-it-

    • @Izackthestickman
      @Izackthestickman 23 дня назад +3

      @@Somebodyherefornow nuh uh

    • @monti2455
      @monti2455 17 дней назад +7

      @@Izackthestickmanrhymes are made of syllables, not words. he rhymed "tain it" with "plain it". only rhyming the last syllable isnt enough.

  • @mradarsh1124
    @mradarsh1124 Месяц назад +15

    You recommended the sponsor with no hesitation, and now it's my time to pay full attention
    I don't know what's going with the UI trend, but I am sure I must share this to my friend❤
    Seems like you are now a writer and that's how you earned a new subscriber!

  • @clamentjohn
    @clamentjohn Месяц назад +6

    That was the best appwrite ad ever!

  • @emanuel3617
    @emanuel3617 Месяц назад +20

    Advertisers, make a requirement, you must rhyme during your ad fragment, I think the style is pretty neat, I watch the ad on repeat, I listen to it and I might buy, cuz let's be honest, rhymes don't lie

    • @Appwrite
      @Appwrite Месяц назад +5

      This is true

    • @DanksterPaws
      @DanksterPaws 11 дней назад

      Itll be nice, then itll get old

    • @DanksterPaws
      @DanksterPaws 11 дней назад

      Itll be nice, then itll get old

  • @kazuho5825
    @kazuho5825 Месяц назад +10

    i rarely watch through an ad, but this time i did, and it wasn’t that bad

  • @doce3609
    @doce3609 Месяц назад +4

    this was so amazing that i didn't even skip the sponsored segment

    • @Appwrite
      @Appwrite Месяц назад +3

      You did the right thing

  • @Waradu
    @Waradu Месяц назад +3

    0:50 uff just perfect editing

  • @TheAereus
    @TheAereus Месяц назад +6

    This made me feel there's a rhyme in every sentence I heard for the following 30 minutes

  • @that_guy1211
    @that_guy1211 12 дней назад +1

    bro made even his sponsor rhyme! Bro is a full on chef!

  • @RatziFatzi
    @RatziFatzi 13 дней назад +1

    To be fair, this IS one of the most Beautiful Videos in a LONG TIME

  • @bradenborman4396
    @bradenborman4396 Месяц назад +3

    Hyperplexed, a true delight,
    His videos are pure dynamite.
    Every move sets hearts afire,
    His name’s the one, we all admire.

  • @Red6
    @Red6 Месяц назад +2

    That is the only sponsor spot I haven't skipped in a long while.

  • @ego-lay_atman-bay
    @ego-lay_atman-bay Месяц назад +4

    I usually skip sponsors, but not when they're just interesting to watch, even if I'm not gonna buy the product.

    • @Appwrite
      @Appwrite Месяц назад +2

      No need to buy, just say hello. 👋

  • @hummerfloppas
    @hummerfloppas 14 дней назад +1

    "What's your favorite rap?"
    "Coding rap."

  • @hameeeed5992
    @hameeeed5992 Месяц назад +10

    Hyperplexed, i love ur videos

  • @gmdsherone586
    @gmdsherone586 16 дней назад +2

    0:12 AAAAAAH, WINDOWS JUMPSCARE

  • @AdamLeis
    @AdamLeis Месяц назад +3

    More golden content,
    Whimsical finesse abounds,
    Masterful effects.

  • @OsamaHJT
    @OsamaHJT 16 дней назад

    That was the smoothest thing I've ever seen I couldn't skip a second, not even the sponsor

  • @nemooverdrive760
    @nemooverdrive760 16 дней назад +1

    You sir are a genuine artist.

  • @basescriptnet
    @basescriptnet Месяц назад +2

    As someone writing lots of code,
    I like how you aligned each thought,
    The rhyming was good, the message insane,
    Your lyrics won't be passing in vain.
    Keep it up, and go with the flow,
    Though I know that you won't slow,
    With CSS 3 I think you are native,
    This time you got very creative!❤

  • @tonylovesmusic6806
    @tonylovesmusic6806 Месяц назад +1

    no way bro put rhymes into an add read
    mad respect

  • @Retroplanegeek
    @Retroplanegeek 17 дней назад

    the sponsor segment is the best part we can agree

  • @directpass2151
    @directpass2151 2 дня назад +1

    This video is SO underrated

  • @Judus_Ille
    @Judus_Ille Месяц назад +1

    Bro is the Doctor Seuss of Css.

  • @baqthiyarmadni
    @baqthiyarmadni Месяц назад

    I refuse to believe that Mozart is dead, this guy is our Mozart, Mozart in Coding, Beethoven in Rhyming and Bach in Video Editing. This is a masterpiece of our current times. we need to celebrate this guy. Hurray!!!

  • @starplatinum3305
    @starplatinum3305 Месяц назад +8

    BABE WAKE UP HYPERPLEXED JUST DROPPED 🗣️🔥🗣️🗣️🔥🔥 !?!?!!!!!!!!!!

  • @Croissinate
    @Croissinate 13 дней назад +1

    New Dr Seuss series looks great

  • @TamskyIsHere
    @TamskyIsHere 29 дней назад

    I don't know if I'm watching Hyperplexed's video, listening to Slim Shady or living in Shakespeare
    Every video of yours is magic in his own way, you are that good that I don't even feel bad for not being that good, I just stare and enjoy every single second of the video

  • @AntonioGonzalez-we4wx
    @AntonioGonzalez-we4wx Месяц назад +2

    This was certainly not what I expect, but I ended quite Hyperplexed.

  • @dinoDonga
    @dinoDonga Месяц назад

    That bit about the fontawesome link killed me. Love it

  • @Peterifiedhuman
    @Peterifiedhuman 23 дня назад

    Man is singing and teaching, let him cook

  • @aditya95sriram
    @aditya95sriram Месяц назад +1

    Absolutely amazing! More of this please 😊

  • @HMT_main
    @HMT_main Месяц назад +1

    How come every time I watch your content and you rhyme,
    I wonder what you came up with this time.
    Your videos are always so great to see,
    and I already wonder what next time’s gonna be…

  • @princedest1ny
    @princedest1ny 21 день назад

    When the wizard multiclasses into bard

  • @finnventor
    @finnventor Месяц назад +3

    I love it when you rhyme

  • @NaudVanDalen
    @NaudVanDalen Месяц назад +2

    This is one video where it's impossible to skip the sponsor, nor do I want to.

  • @Mateo-rl1qb
    @Mateo-rl1qb 10 дней назад +1

    One thing I know,
    Those squares have some flow.
    A cool creation,
    I might use it in an application.
    This vid was cool
    And I ain't no fool.
    This vid deserves a like -
    No matter if at home or on a hike.
    Now that I'm done,
    Go have some fun!!!

  • @MustafaSakallli
    @MustafaSakallli Месяц назад

    Wow, this was absolute fire
    I didn't know
    CCS is something to desire

  • @AbdelrahmanRamadan-cp5jx
    @AbdelrahmanRamadan-cp5jx 15 дней назад

    First video in youtube history that made my WANT to watch the sponsered part !!

  • @Transcube157_Oficial
    @Transcube157_Oficial 18 дней назад +1

    Man the video and the sponsor was both fire 👍

  • @RobertWildling
    @RobertWildling Месяц назад

    Best channel on programming. And poetry. And art. And all those combined!

  • @pjsans
    @pjsans 16 дней назад

    Honestly, appwrite is super chill for letting you rhyme their ad-spot too, very chill, very chic

  • @querela92
    @querela92 24 дня назад +1

    Did he just *boop* us?!

  • @UmarHamza
    @UmarHamza 11 дней назад

    Wow, you are super talented. Made a whole tutorial and rhymed all the way through. I don't know any creator that can do that 😂

  • @tech_savvy_guy
    @tech_savvy_guy 25 дней назад

    This has to be the best CSS video I have seen! Loved it! 🔥🔥

  • @kipchickensout
    @kipchickensout Месяц назад +1

    "Sponsor skipped"
    NOOOO *goes back to watch sponsor*

    • @Appwrite
      @Appwrite Месяц назад +1

      You did the right thing

  • @Mk4_20-gw2uu
    @Mk4_20-gw2uu 21 день назад

    "Firebase Nation" was brilliant

  • @Archangelgamer1997
    @Archangelgamer1997 Месяц назад +2

    Hyperplex is really great
    His videos I do appreciate

  • @hamzamotara4304
    @hamzamotara4304 22 дня назад

    Damn, you have the best ad reads.

  • @RussDnB
    @RussDnB Месяц назад

    I have no idea how you excel at everything you put out. Even your sponsorship has me hooked.

  • @mmewtwosayshello
    @mmewtwosayshello 24 дня назад +1

    At 2x speed this sounds like the geekiest rap of all time.

  • @apolloangevin9743
    @apolloangevin9743 Месяц назад

    This stuff is so easy for this guy he has to come up with new ways to add even more flare. Amazing.

  • @lvcifer-cloverfield
    @lvcifer-cloverfield 12 дней назад

    I learned something new and my nose was booped
    And the pacing aligned with how long I pooped

  • @Foxil.0
    @Foxil.0 14 дней назад

    It's now easier to save every code, Thanks for the creator to make this episode

  • @MichaelTeeuw
    @MichaelTeeuw 18 дней назад

    From this point on, I require every tutorial on the web to be in rime. Subscribed!

  • @lightning_11
    @lightning_11 14 дней назад

    One of the only sponsors I enjoyed watching!

  • @trimpta
    @trimpta Месяц назад +1

    Ad so good i disabled sponsorblock

  • @jessenguyen3012
    @jessenguyen3012 7 дней назад

    The most whimsical programming creator on RUclips

  • @ThePlainEssence
    @ThePlainEssence Месяц назад

    Hyperplexed, your video’s pure delight,
    Editing and insights, all just right.
    Your skills are sharp, your style is sleek,
    In the RUclips realm, you're truly unique!

  • @tncoder
    @tncoder Месяц назад

    This is the best tutorial video I've ever seen. Well done!!!

  • @harryvpn1462
    @harryvpn1462 13 дней назад +1

    This is the best video on the site

  • @alexhiatt3374
    @alexhiatt3374 12 дней назад

    thanks I didn't know I could adjust hover transition times

  • @Pantherasinleopard
    @Pantherasinleopard Месяц назад

    this man is the next Kendrick Lamar "a few we'll use an inspector then bury each one with the NCH child selector"🥶🥶🥶🥶🔥🔥🔥

  • @splience
    @splience Месяц назад

    Wow, the rimes are amazing! I also love how you don't have any visible cuts and everything morphs so nicely into the next scene.

  • @mick001
    @mick001 21 день назад

    first sponsor ive actually watched all the way thru

  • @Light846
    @Light846 Месяц назад

    Im blown away by the video and the sponsor part was so seamlessly integrated and so creative!

  • @NewlineVoid
    @NewlineVoid 23 дня назад

    the only sponsorship segment I have watched without skipping

  • @LimeLiquide
    @LimeLiquide 20 дней назад +1

    thanks for including me in thumbnail

  • @mdazmal3288
    @mdazmal3288 24 дня назад

    when he says break it into pieces and the blocks appear like Microsoft logo, I see what you did here! XD

  • @SirFisho
    @SirFisho Месяц назад

    If i could give this a thousand likes, believe me i would!
    So much effort in your videos, as always

  • @rottjavel3073
    @rottjavel3073 Месяц назад

    The boop on the nose part made me unreasonably happy

  • @zackator4565
    @zackator4565 Месяц назад

    I just simply can not be the only one
    beeing astonished by the quality in which this video is done.
    The writing, editing and animation
    show the insane level of dedication.

  • @Melvin420x12
    @Melvin420x12 Месяц назад

    This video is so magical, my dopamine after watching it became maximal. I'm a big advocate for beautiful code, anyone should write like a poet. Well done! *boop*

  • @tobeess
    @tobeess Месяц назад +2

    "While on the way out it's slow and consistent, on the way in the change should be instant." 🗣🗣🗣🗣🗣🗣🗣

  • @devdhaif
    @devdhaif 20 дней назад

    This dude is not just a developer , he is an artist !

  • @jmg9509
    @jmg9509 Месяц назад +1

    It's usual that I like to skip the sponsor,
    but for this one he had me on the edge of my seat to ponder.

    • @Appwrite
      @Appwrite Месяц назад

      To that I suggest you watch a bit longer

    • @jmg9509
      @jmg9509 Месяц назад

      @@Appwrite Ahh yes, that might make my choices a lot stronger

  • @--bountyhunter--
    @--bountyhunter-- Месяц назад

    Everytime from spawns after like 1 month , releases a banger then disappears for a month again

  • @hristov1865
    @hristov1865 Месяц назад +1

    We go JS Shakespeare before GTA VI 😤😤😭😭😭😭😭

  • @erichessonline
    @erichessonline Месяц назад

    I deeply respect both your code and rhyming skills...this had to have taken a crazy amount of time to make. Thanks for making me smile today 🙂

  • @CodingWithLewis
    @CodingWithLewis Месяц назад +1

    Now we just need someone to create a beat.

  • @cubed_guy
    @cubed_guy 21 день назад

    Slickest ad ever.

  • @CheeseDoges
    @CheeseDoges 13 дней назад

    this is strangely amazing

  • @graveeater7
    @graveeater7 Месяц назад

    Your videos shine so bright and bold,
    Your content's fire, never growing old!
    You share your passion with skill and grace,
    A true creator, in every single place!