The Art of Pure CSS

2021 ж. 2 Шіл.
545 540 Рет қаралды

The highly anticipated sequel to Sun Tzu's "The Art of War". I promise I'll buy a proper microphone soon...
See the CSS art itself: kevinjycui.github.io/css-video
See it on GitHub: github.com/kevinjycui/css-video
Bad Apple!!: • Bad Apple!! played wit...
Join the Discord: / discord
Twitter: / junferno
Check out my other stuff on GitHub: github.com/kevinjycui
Chickenbread's rendition: • Bad Apple!! but it's p...
Music tracklist:
• The Complete Junferno ...
Community Captions:
Portuguese (Brazil) - Guilherme BR

Пікірлер
  • Damn, this guy is great at the deadpan comedy

    @jordanle366@jordanle3662 жыл бұрын
    • hes amazing

      @attaxolotl@attaxolotl2 жыл бұрын
    • ;)

      @oamioxmocliox8082@oamioxmocliox80822 жыл бұрын
    • What's deadpan comedy

      @lilyofluck371@lilyofluck3712 жыл бұрын
    • @@lilyofluck371 from the wiki: "Deadpan, dry humour, or dry-wit humour is the deliberate display of emotional neutrality or no emotion, commonly as a form of comedic delivery to contrast with the ridiculousness or absurdity of the subject matter. The delivery is meant to be blunt, ironic, laconic, or apparently unintentional."

      @luigios1125@luigios11252 жыл бұрын
    • Type of dude I wish was in my CS class

      @rattrap777@rattrap7772 жыл бұрын
  • whenever I see someone going through the sass docs i get a real “i can see my house from here” vibe cause those little arrows on the tabs of sass vs css were my first open source contribution back in the day - great video btw :)

    @johncomposed@johncomposed2 жыл бұрын
    • Whoa! That's so cool!

      @sriramramesh5318@sriramramesh53182 жыл бұрын
    • that is sooo cool

      @tacokoneko@tacokoneko2 жыл бұрын
    • I love pointing out bugs on open source software like Vs Code. In a matter of minutes they fix the bug.

      @SirusStarTV@SirusStarTV2 жыл бұрын
    • lol thats so cool

      @yulin84@yulin842 жыл бұрын
    • I can't find the arrows in this video. :(

      @thebiggestcauldron@thebiggestcauldron2 жыл бұрын
  • So now when my boss sends me artist renditions of how he want the website to look I can just convert it to a css image and go back to playing Minesweeper.

    @Billy4321able@Billy4321able2 жыл бұрын
    • oh fuck why i never thought about that

      @morgensheeeern@morgensheeeern2 жыл бұрын
    • me likey!!!

      @oniricPrj@oniricPrj2 жыл бұрын
    • Its like book archiving by taking pictures of the pages and convert to pdf instead of typing out the content

      @theshuman100@theshuman1002 жыл бұрын
    • @@theshuman100 that's actually okay if you're using OCR and reviewing it afterwards lol

      @LC-hd5dc@LC-hd5dc Жыл бұрын
    • Job is temporary, minesweeper grind is eternal

      @user-jd6do2ls2j@user-jd6do2ls2j Жыл бұрын
  • Who needs html, just draw text and everything in css. It’s much easier

    @neotrash5864@neotrash58642 жыл бұрын
    • Easier... *slams head on desk*

      @gardengnomenation4854@gardengnomenation48542 жыл бұрын
    • -Quote from dead man

      @JimmyJonJillakers@JimmyJonJillakers2 жыл бұрын
    • @@rin_etoware_2989 それな

      @OrangeC7@OrangeC72 жыл бұрын
    • How you gonna do that without linking css to the html

      @RubyPiec@RubyPiec2 жыл бұрын
    • Oh hey it's flutter /s

      @doublinx2@doublinx22 жыл бұрын
  • CSS is simultaneously really easy to understand and really "wtf even is this"

    @flameguy21@flameguy212 жыл бұрын
    • Kinda like brainfuck simple but also not really

      @_averageenjoyer_@_averageenjoyer_ Жыл бұрын
    • Good summary

      @whannabi@whannabi Жыл бұрын
    • Programming in General.

      @ataladin87@ataladin87 Жыл бұрын
    • especially all the vendor prefixes will make u want to off urself :>>>>

      @tomxzf@tomxzf10 ай бұрын
    • True, im having a better time making my own framework than using other people work. Granted it's a spaghetti code, but it's MY spaghetti code so i know what is and what not about it.

      @w_ldan@w_ldan9 ай бұрын
  • "you can also draw gex" I'm sold

    @AoTheMighty@AoTheMighty2 жыл бұрын
    • They didn't told me they had GEX

      @boio_@boio_2 жыл бұрын
    • This is like practising javascript in Mark Zuckerberg's house

      @jaypostsvideos4011@jaypostsvideos40112 жыл бұрын
    • @@boio_ How else would we have gex night?

      @AoTheMighty@AoTheMighty2 жыл бұрын
    • @@AoTheMighty this is my favorite gex KZhead channel

      @williamsmith6921@williamsmith69212 жыл бұрын
    • scott the woz epic funnies

      @jacobdaniels3246@jacobdaniels32462 жыл бұрын
  • "You want to make Mario? It's a me, Carpal tunnel." I DIED LOL

    @suspiciousstew1169@suspiciousstew11692 жыл бұрын
    • 4:12

      @official-obama@official-obama2 жыл бұрын
  • 0:19 That ominous pause before typing the L after nh lmao truly a man of culture

    @jahuuuu9625@jahuuuu96252 жыл бұрын
    • Those who know 💀💀

      @unrivalledking@unrivalledking Жыл бұрын
    • I didn't even notice it until I saw this comment LMFAO

      @faunp@faunp Жыл бұрын
    • Abandon all hope, ye who enter here

      @jilanwicaksono@jilanwicaksono10 ай бұрын
    • Huh what does it mean?

      @kiyu3229@kiyu322910 ай бұрын
    • Bruh

      @What-ki4we@What-ki4we9 ай бұрын
  • Unrelated but, One time my website design teacher told us to make a website with a bunch of different requirments but it was only one page. Normally he makes us link it to other stuff but this time he didn’t so I drew everything in mspaint and then inserted a single image into the page. I got a 100 for that :)

    @Spyziy@Spyziy2 жыл бұрын
    • noice strategy there! xd

      @kentoscocos5238@kentoscocos52382 жыл бұрын
    • lmao brilliant idea

      @Vysair@Vysair2 жыл бұрын
    • Only when One Page

      @hrsh042@hrsh0422 жыл бұрын
    • what about responsiveness? he checked on exactly the same monitor size?

      @alexradu1921@alexradu19212 жыл бұрын
    • I had a similar assignment and use the "Checkbox Hack" and anchor links with "#", he also didn't want javascript only html and css... it was the beginning of the curse and he only shown us basic html tags and background-color

      @Shadownrun2@Shadownrun2 Жыл бұрын
  • when I see the "nh" typed into the bar, I'm not expecting it to get followed with hockey

    @Simon-me9fh@Simon-me9fh2 жыл бұрын
    • Timestamp?

      @KushagraPratap@KushagraPratap2 жыл бұрын
    • @@KushagraPratap 0:19

      @ananttiwari1337@ananttiwari13372 жыл бұрын
    • E

      @kcfish4862@kcfish48622 жыл бұрын
    • n

      @ark8705@ark87052 жыл бұрын
    • t

      @lackdejuranez7084@lackdejuranez70842 жыл бұрын
  • "I'm having this ominous feeling as if I'm being watched. Oh hey let's talk about web browsers." This guy is the master of changing topics, where can I learn this power?

    @mebestupid7134@mebestupid71342 жыл бұрын
    • did he really change topic though?

      @videogamesarecool9280@videogamesarecool92802 жыл бұрын
    • you seem to have missed the joke

      @luphoria@luphoria2 жыл бұрын
    • skillshare

      @syzikiy4450@syzikiy44502 жыл бұрын
    • Anyway, have you guys seen the Chainsaw Man trailer?

      @cainschamber@cainschamber2 жыл бұрын
    • The dark side of computer science is a pathway to many abilities some consider to be... unnatural

      @OrangeC7@OrangeC72 жыл бұрын
  • and that's it, you're my new favorite youtuber

    @pastarru@pastarru2 жыл бұрын
    • Welcome to the club

      @yuuji8447@yuuji84472 жыл бұрын
    • woah i didnt know that youre gonna be here lol

      @olisiur@olisiur2 жыл бұрын
    • exactly... knows exactly what he's talking about and makes it interesting AND doesn't waste our time. so hard to find

      @FurySracing@FurySracing2 жыл бұрын
  • the art of pure css isn't red, magenta, and black as most would believe

    @theengineer-dellconagher@theengineer-dellconagher2 жыл бұрын
    • You forgot violet.

      @user-fe8gx3ie5v@user-fe8gx3ie5v2 жыл бұрын
    • @@user-fe8gx3ie5v united kingdom blue

      @kakyoindonut3213@kakyoindonut32132 жыл бұрын
    • United nation blue

      @hashfordalulz@hashfordalulz11 ай бұрын
  • “Will accessibility forever act as an Avenue for abuse” Me: wut *image of bad piggies Me: it all makes sense now

    @kaidenjordan3009@kaidenjordan30092 жыл бұрын
    • I don't get it

      @Archimedes.5000@Archimedes.50002 жыл бұрын
    • @@Archimedes.5000 same, tbh

      @noellelavenza494@noellelavenza4942 жыл бұрын
    • @@noellelavenza494 i think what they meant by accessibility is that in angry birds, the piggies are fully trapped within wooden blocks, preventing you from directly hitting them

      @otesunki@otesunki2 жыл бұрын
    • @@otesunki absolutely not, no.

      @noellelavenza494@noellelavenza4942 жыл бұрын
    • @@noellelavenza494it's because in the game "bad piggies" and in the whole angry birds franchise the piggies get abused nonstop, like getting blown up and literally killed

      @mogenoof@mogenoof9 ай бұрын
  • Watched this while eating soup. I thoroughly enjoyed it. The video too.

    @kimcolpo@kimcolpo2 жыл бұрын
    • Soup is good.

      @KorekiyoSoup@KorekiyoSoup2 жыл бұрын
    • Soup is really good.

      @TimeTravelingFetus@TimeTravelingFetus2 жыл бұрын
    • @OneFortyFour eat

      @KushagraPratap@KushagraPratap2 жыл бұрын
    • @OneFortyFour yes

      @KorekiyoSoup@KorekiyoSoup2 жыл бұрын
    • @OneFortyFour eat

      @ananttiwari1337@ananttiwari13372 жыл бұрын
  • As an experienced front end developer I can confirm that when Im writing css I don't know a single thing I'm doing

    @Esomusicaify@Esomusicaify2 жыл бұрын
  • Making art with CSS is pretty easy But making responsible CSS art is impossible

    @Gameplayer55055@Gameplayer550552 жыл бұрын
    • There's no ethical CSS art under capitalism.

      @thebiggestcauldron@thebiggestcauldron2 жыл бұрын
  • Still don’t know how to center a div after multiple classes using HTML

    @kizu-kurisu@kizu-kurisu2 жыл бұрын
    • container { display: flex; align-items: center; justify-content: center; } or if your browser SUCKS: content { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }

      @otesunki@otesunki2 жыл бұрын
    • in the parent container (flex-direction is default/column), set justify-content to center: components inside the container are centered vertically in the container set align-items to center: components inside the container are centered horizontally in the container but if the container has flex-direction set to row, set align-items to center: components inside container are centered vertically in the container set justify-content to center: components inside container are centered horizontally in the container

      @sherry2480@sherry24802 жыл бұрын
    • I still wonder why they no longer support the use of center tags on HTML. It's so much easier that way.

      @astral6749@astral67492 жыл бұрын
    • @@sherry2480 i always mix the two up

      @otesunki@otesunki2 жыл бұрын
    • @@astral6749 its not anymore supported, since in the newer html versions semanticness became a focal point, which means that one should strive to write html to describe what something IS and not what it should look like, since css already exists for the look

      @inklingboi8431@inklingboi84312 жыл бұрын
  • "new and inventive ways to use it as little as possible" 😂 edutainment is an elusive art and this man is mastering it 👏👏👏

    @bdpod@bdpod2 жыл бұрын
    • "it's a me, carpal tunnel" 😂 2022 1M subs let's goooo 🚀

      @bdpod@bdpod2 жыл бұрын
  • 0:16 Starting out stating the facts, that's what I like in a video.

    @CrazyWS@CrazyWS2 жыл бұрын
  • That RNG guessing game is the best analogy i have ever heard for this.

    @ShadyProductionsMC@ShadyProductionsMC2 жыл бұрын
  • "you can also draw gex" say no more im sold

    @necrotazer@necrotazer2 жыл бұрын
    • Note to self:don't try to play fnf on chromebook

      @dragonlordsaviour7005@dragonlordsaviour70052 жыл бұрын
  • The entire video: summarizing an html/css course The conclusion: humanity will ultimately be doomed to its failure to cooperate with itself

    @Hydroxyl@Hydroxyl2 жыл бұрын
  • "Whether is edge, chrome or any of the better ones..." Bro... I love you.

    @Lambda_Ovine@Lambda_Ovine2 жыл бұрын
  • this video re-taught me html and css from when i learnt it 9 years ago in a couple of minutes

    @znefas@znefas2 жыл бұрын
  • came for the meme, left with one of the best intros to HTML and CSS I've ever seen As a react engineer, I love this for newcomers, thank you :)

    @DarkSwordsman@DarkSwordsman Жыл бұрын
  • Only discovered your content quite recently and I'm loving the sort of computer science content explaining how things work! Keep up the good work! :)

    @maybeweebtrash_6695@maybeweebtrash_66952 жыл бұрын
  • 2:17 lmaoo this was good

    @vivada2667@vivada26672 жыл бұрын
  • I really wasn't expecting that ending. Great work! Looking forward to the next one

    @btarg1@btarg12 жыл бұрын
  • I was not prepared for the mashup at the end Also the timing of beeg yoshi with your commentary was on point

    @StewartMcGinnis@StewartMcGinnis2 жыл бұрын
  • Love the videos recently. Entertaining, informative and funny all at once, a great and hard to master mix

    @asaistudios@asaistudios2 жыл бұрын
  • Such a quality video man, really love to see stuff like this!

    @aidantigerfish1915@aidantigerfish19152 жыл бұрын
  • I wish my profs were as engaging as you man damn. Fantastic video!

    @pouyansh3313@pouyansh33132 жыл бұрын
  • please continue to make informational videos like this, I could listen to you for HOURS

    @freakmoch@freakmoch2 жыл бұрын
  • Great video mate, keep up the good work!

    @felixschnapsy410@felixschnapsy410 Жыл бұрын
  • Dang, this was amazing! The video itself is art, great style

    @Dominik-K@Dominik-K2 жыл бұрын
  • Oooo I really enjoyed the video. Subscribed straight away

    @apna_divyam@apna_divyam2 жыл бұрын
  • Drawing pixel by pixel on css is basically reinventing image formats that use index color table, like gifs, and comes with the same caveats.

    @hydreg@hydreg Жыл бұрын
  • 9:35 "Fraud" **shows picture of fat Yoshi** Not suggesting anything but I think that was not entirely accidental

    @huvudpersson7344@huvudpersson73442 жыл бұрын
  • Absolutely love your videos! Glad I found this channel

    @MentalMMManiac@MentalMMManiac2 жыл бұрын
  • Great humor; especially loved "It's a me! Carpal Tunnel." 4:09

    @janonimous5781@janonimous57812 жыл бұрын
  • This was a really engaging and well made video, great job!

    @fuckitimjem@fuckitimjem2 жыл бұрын
  • these vids are so good and informative. keep going June!

    @skunkworks4284@skunkworks42842 жыл бұрын
  • Amazing video! You managed to explain so many things in so little time. Success to you!

    @roucool1323@roucool13232 жыл бұрын
  • of all programming channels in youtube, you are the first (in english) that i really like and enjoy seeing, new sub ofc

    @elsbrr7821@elsbrr7821 Жыл бұрын
  • That feeling when you find an underrated programming channel, subbed!

    @cameronguilbeau5888@cameronguilbeau58882 жыл бұрын
  • i don't know how i recognized every background soundtracks you used. thank you for this amazing video :) and remember, if you know CSS, you can join in too!

    @kepler69c32@kepler69c322 жыл бұрын
  • I LOVE your editing style!

    @ka11i73@ka11i732 жыл бұрын
  • This is the first video I've seen on this channel and I already love it. You deserve this sub totally!

    @GodModeMaker@GodModeMaker2 жыл бұрын
  • you may be my favorite smaller youtuber. godspeed on your way up!

    @magipotato430@magipotato4302 жыл бұрын
  • Please never stop making videos they're too beautiful to go without

    @brokoblin6284@brokoblin62842 жыл бұрын
  • This is a lovely video thank you for making my Sunday better.

    @MegaSascuach@MegaSascuach2 жыл бұрын
  • 6:44 man of culture

    @mrck224@mrck2242 жыл бұрын
  • Just found this video on the side bar for a Source Gaming Smash video and I thought this was about Character Select Screens (wrong CSS on my part, I guess), but a very interesting video. Good Job!

    @jaredhebert942@jaredhebert942 Жыл бұрын
  • holy cow. subbed and liked. great video buddy.

    @dryoldcrabman6890@dryoldcrabman68902 жыл бұрын
  • the bst maze-walking implementation for making the css drawing more efficient is pretty genius. Really cool to learn about this even if I'll never code like this

    @kpdelaney6460@kpdelaney6460 Жыл бұрын
  • extremely underrated channel, really hope you blow up soon and make it big

    @myst7020@myst70202 жыл бұрын
  • I really love CSS, this summed up my experience on my journey of becoming a fullstack developer. I would not be surprised if one day I see you making Bad Apple using Three.js or any similar framework.

    @daleryanaldover6545@daleryanaldover65452 жыл бұрын
  • this is golden subbed and expecting more of the ominous watching stuff

    @cescimes@cescimes2 жыл бұрын
  • i was not expecting that good of a video!

    @vk-fb4ox@vk-fb4ox2 жыл бұрын
  • 1:24 "The best way", wait are there other ways to style websites that I don't know about 👀

    @RikThePixel@RikThePixel Жыл бұрын
    • there are other frameworks like Tailwind that allows you to stlye elements using classes. Boostrap is another framework that he mentions. You can also use javascript to style elements.

      @cdey3886@cdey3886 Жыл бұрын
  • you know you've been a web developer too long when this stuff forces your mind into the darkest recesses of coffee fueled 2 am coding sessions

    @JosefPiano@JosefPiano Жыл бұрын
  • Love your videos, please keep it up

    @insertname252@insertname2522 жыл бұрын
  • Excellent content, man!❤

    @AnweshAdhikari@AnweshAdhikari Жыл бұрын
  • love your channel every video is insane

    @Charlie-hv3dh@Charlie-hv3dh2 жыл бұрын
  • I never noticed the cloud design on your wall, definitely makes it better than it already is

    @patheticest@patheticest2 жыл бұрын
  • dang bro i really love your channel, i subbed as a joke because of the bad apple videos but you`re great

    @0x045c@0x045c2 жыл бұрын
  • Amazing video, great humor and never expected to hear Dark Pit's theme ever outside of the Kid Icarus game

    @kirariyt@kirariyt2 жыл бұрын
  • I think I stumbled upon a gem of a channel. Amazing man

    @Horzinicla@Horzinicla2 жыл бұрын
  • Damn, this guy taught the basics of web developing in the first 5 min. Congrats, great video!

    @henriqueleszczynski37@henriqueleszczynski372 жыл бұрын
  • HOLY SCHIETT I NEED A FULL VERSION OF THIS MASHUP

    @bwuh6761@bwuh67612 жыл бұрын
    • bad coconut mashup on youtube

      @nepunepu5894@nepunepu58942 жыл бұрын
  • I can't believe you managed to explain something as complicated as the web in such a comprehensive way and in such a short amount of time

    @TheJobCompany@TheJobCompany2 жыл бұрын
  • this is an UTTERLY fantastic video, well explained, well edited, well written, etc., but i also feel the need to say EXCELLENT use of video game music. your taste is immaculate

    @lumanae@lumanae2 жыл бұрын
    • also your captions. really really appreciate the effort put into that

      @lumanae@lumanae2 жыл бұрын
  • Your humour is amazing, your demonstration while talking is on point! Me loves!

    @Tondadrd@Tondadrd2 жыл бұрын
  • I really enjoy watching your videos at 4:00am in the night

    @bigbreasts@bigbreasts2 жыл бұрын
  • Great moves, keep it up, proud of you

    @fernandoborges1736@fernandoborges17362 жыл бұрын
  • Dude that ending 😩👌

    @MiguelSantos2002@MiguelSantos20022 жыл бұрын
  • Truly amazing what the human mind is capable of achieving with enough time and dedication.

    @gaemer3967@gaemer39672 жыл бұрын
  • quality video my dude keep up

    @gaurdein@gaurdein2 жыл бұрын
  • Really good video, keep it up

    @Azetay67@Azetay672 жыл бұрын
  • Thanks for the vid, packed full of entertainment as always

    @patrickgh3@patrickgh32 жыл бұрын
  • very nice way to start the video

    @kijeenki@kijeenki8 ай бұрын
  • I was so happy when Junferno finally showed Astolfo, though he was kinda late in the video and not as hidden as other videos. I like the Astolfo searching game, but please increase the difficulty a bit.

    @die-mango-tv7134@die-mango-tv71342 жыл бұрын
  • that was a pretty great crash course in web design. well put!

    @Hyperboid@Hyperboid2 жыл бұрын
  • I can listen to you all day, your voice is so good

    @aecor111@aecor1112 жыл бұрын
  • I Subscribed because of this video. Keep up the amazing work

    @Cebbinghaus@Cebbinghaus2 жыл бұрын
  • Hello Jun, thank you for the content! I love you

    @gabsprado121212@gabsprado1212122 жыл бұрын
  • Great video! Taught me something new about CSS!

    @nickh7856@nickh78562 жыл бұрын
  • thank you thats the best video i've seen in years

    @gabrielrocha1330@gabrielrocha13302 жыл бұрын
  • Thanks, great finale

    @Cobalt_027@Cobalt_0272 жыл бұрын
  • That was the best concise explanation of web design I have ever heard

    @eitanraitses3059@eitanraitses30592 жыл бұрын
  • you are very talented my friend great video

    @ux7188@ux71882 жыл бұрын
  • Keep up the informative content!

    @maria_remedios@maria_remedios2 жыл бұрын
  • I have only watched 20 seconds and you got me subbed. The meme game is strong.

    @No-uc6fg@No-uc6fg2 жыл бұрын
  • The DK Rap edit is so clean. Awesome!

    @ysink@ysink2 жыл бұрын
  • Such a well made video!

    @pradyumnamahajan4910@pradyumnamahajan49102 жыл бұрын
  • ok I watched bad apple in command prompts, subscribed, never watched again. Holy fuck I am going to watch every single one of your uploads this was super well made

    @ShydenPierce@ShydenPierce2 жыл бұрын
  • This is one of the best videos I’ve seen in a while.

    @thesullivanstreetproject@thesullivanstreetproject2 жыл бұрын
  • with the video quality you have, this channel may get a lot bigger really soon

    @TheViakTroll@TheViakTroll2 жыл бұрын
  • This was not only informative but the subtle humour throughout this video was hilarious

    @WindStreak_@WindStreak_9 ай бұрын
KZhead