How Do Vector Graphics Work?

Vector graphics allow you to rescale images to any size without losing quality! How does that work?
Thanks to Pearl Auto for supporting Tech Quickie. Go to pearlauto.com/t... to get FREE two-day shipping!
Follow: / linustech
Join the community: linustechtips.com

[@Dani98664]

Heh...that pun at the end...

[@TuppiKissa]

just horrible

[@dorhayoon5746]

not professional at all...

[@Desro947]

Barely deserved a nose exhale.

[@Squeezy01]

I mean, it is not his wurst :D

[@andiCNH]

heh, linus, heh

[@andriup]

That means I've been doing my logos wrong all this time. Vectors are the real thing! Thank you Linus!

[@freakstate]

andriup even if you have a logo that's rasterised, Illustrator can have a guess at trying to convert into vectors as Linus said. for graphics and logos especially there's alot of different settings to get you most of the way there and then fiddle with anchor points or retrace! (if you ever needed to)

[@freakstate]

***** Yes, especially if its low res to start off with. But hopefully, and this is the point of a logo, its not that complicated to vector up. God help you if you have a photo or something insanely complicated as a logo!

[@allanrichardson1468]

andriup Going back to Windows origins, fonts were originally coded as multiple raster images (bitmaps) for each size, and some still are, which is why, when you pull up a font menu in a program, some of the fonts are only available in a few sizes. When PC processors got more powerful and memory got bigger, someone (at Microsoft perhaps) devised a way to encode the character sizes in a font as vectors, which could be expanded, in principle, to any size. These fonts are labeled in menus and file names as TT for the trademark True Type. The modifications to make them some combination of Bold, Italic, and Underlined are simply mathematical transformations to the vectors before expanding them to bitmap format.

[@andriup]

Allan Richardson thanks for the info. I've always wondered what does the TT stand for. Now I know.

[@andriup]

freakstate so is Illustrator a more appropriate software for working with vectors? Because I still have the psd files with the logos, should I just exportem as .EPS and open them in Illustrator?

[@allanrichardson1468]

Back in the old days, some CRT displays used vector graphics to display hand drawn and mathematically generated shapes for interactive design terminals. The associated display processors, huge CRTs and drive circuits, and the need to reserve real time on large mainframes meant that they were reserved for high value functions such as radar stations, scientific simulations, and designing cars for three years in the future. One salient device used with these displays was the light pen, a photodetector with a spring loaded spherical lens which switched the detector on when pressed against the screen, and a manual "select" button on the side to provide operator control. It would pick up the very fast rise of the burst of light when the electron beam came within its detection radius, giving its processor the X and Y coordinates on the screen, and identifying the vector instruction being drawn, thus identifying where and to which object the pen was pointed. The interface logic was later adapted to use with the mouse (the select button became the click).

[@Isaac.D.grizzly]

Ok boomer

[@jonka1]

I think you just told us more useful information than this over-presented and disappointing video.

[@danimayb]

Vector graphics have been in use since the 1950s lol. And 3D rendering throughout it's history to this day uses vector graphics. And in engineering, architecture, surveying, typography.... I get that vibe in here that people are talking about something that is off the beaten track, But it is as common in graphical technology as graphics itself.

[@5Gburn]

Raster to vector...so that's what happened to Max Headroom...

[@BurakBagdatli]

Vector graphics aren't necessarily smaller in file size but you're right to say that for the right use cases they tend to be smaller. I saw many line charts or scatter plots or similar things that just require more points than number of pixels and they end up being huge. Imagine having points on 10000 places on a graph. Each of those points will require an X and a Y coordinate and some extra code to define them. It really adds up quickly. Whereas a raster image would not care about how many points there are on the graph, it'll put close enough points on a single pixel but the human eye isn't going to differentiate between really close points from each other when there are 10000 points anyway. Nevertheless, they're my favorite method for making figures and graphs for my thesis. Yay for SVG and PDF! And Inkscape. Thank you, Inkscape!

[@Schattengewaechs99]

Thank you LaTeX!

[@taspeteris]

What if I told you that pixels are vectors that are 1x1 pixels

[@endornaut]

Well if you're okay to view pictures as colored huge boxes that would work I guess...

[@SEB1991SEB]

@@endornaut It would be ok for 8-bit graphics cos they're supposed to be pixellated anyway

[@mxd3bill70]

What if i told u there r 8 different recipies for octopus?

[@CheahMichael]

Speaking of porn, TUNNELBEAR let you surf your favourite porn site ANONYMOUSLY! You missed that chance Linus. You missed that chance.

[@dnghn.design]

?

[@ErikratKhandnalie]

Easy solution - Vector Hentai

[@MasterYoshidino]

That would be so cool to have. Right now the closest is 3D rendered porn but having 2d vector adult animation that scales from anywhere between 480p and 8k would be awesome.

[@jonathanozik5442]

There IS!!! Just use "waifu2x-caffe" ;) github.com/lltcggie/waifu2x-caffe/releases Deep-Neural-Networks (almost) = magic :-D

[@zombeaver69]

That's actually very possible

[@willenribeiro1010]

that actually is very old, there was a lot of flash applications based on hentai on the 2000s

[@SevastianYT]

Please stop, this is gross, I'm a teenager boy and even I think that that is gross, stop.

[@goodlyboony]

For a second there, I thought linus was sponsored by a porn website

[@manikpandey3133]

oh man ..lol

[@FaZekiller-qe3uf]

Metooz

[@Ethanhall100]

That backup cam is a cool idea, but really? $500USD?

[@mattw4211]

Ikr, I would've bought one. Too bad.

[@BOOMProductionsVIDs]

Ethan Hall yeah I was impressed and would buy one if it was more around the 199$ range

[@user-po6hn9id1t]

it does have a model for europlates?

[@Hoch134]

I know from bicycle computers that cheap wireless hardware is very bad... also, I don't understand why it has to be wireless. It's not hard to just put a cable through the car.

[@Hoch134]

But it's extremely easy and you don't have to refill batteries or fear that the signal gets lost.

[@ksells]

Anyone else notice "adress" at 4:13?

[@DarkGuy1001]

I did.

[@farhanskanam]

Indulge your OCD :P

[@aidanr5260]

ksells I

[@valorix]

I see a problem here :D I think that should be "A dress" not "adress" :D

[@MostafaElSakari]

No

[@TheRegalRolston]

so how are you supposed to stop someone from stealing a 500$ piece of tech off the back of your car?

[@naota3k]

Security fasteners.

[@NamesReed]

tape penises to it

[@ShivaSharma-tt2tk]

Kick their ass

[@Alfa]

there are three types of people in this world

[@jasonlam8588]

Wait are you telling me that "enhance" thing in Jason Bourne wasn't total bs?

[@Calyx]

OMG SPOILERS

[@jasonlam8588]

It was in the trailer, when the CIA saw him on camera and said "omg it's Jason Bourne" Plus the film isn't great anyway

[@stephanieplotkin3652]

Thank you: this was extremely helpful. I am trying to make my blog a little nicer but didn't understand what these "vector" graphics were...you made things so much easier! Keep up the good work!

[@hirenmore7495]

Hey!! It's always great to hear you and videos are not lengthy so.. I can watch them on the go!!!

[@celiok3795]

4:20 aaahh That Joke

[@monkeywithocd]

As someone working towards making 2D videogames, I wonder if a clever combination of vector and raster could make a 2D game look better when scaling. Probably beyond my programming expertise, but an interesting question I feel nonetheless.

[@KidPrarchord95]

I know this is late, but yes; Vector graphics are the standard in the industry, I believe, with pixel-art games being a notable exception.

[@nullpointer1755]

The problem with Vector Graphics is that most algorithms used to render them are software based and don't use the hardware acceleration that GPUs provide, so if you want to integrate vector graphics with the graphics pipeline, using APIs like Vulkan and OpenGL, you have to find a way to triangulate the vector shapes since GPUs only draw using primitives like triangles and quads. Another solution is to write your own GPU-based renderer using shaders to evaluate the stroke/fill region of a vector path in order to properly render it. Of course, if you game doesn't use dynamic generated vector shapes, them you can just render them one time.

[@scarpusgaming]

@@KidPrarchord95 yeah i mean this is how basically all flash games worked lmao

[@gruffyddgozali]

Jeez Linus being a savage on Taran with that billboard joke

[@Ryzza5]

Linus doesn't edit the videos, so often wouldn't know what images will end up going there.

[@gruffyddgozali]

Ryzza5 He would probably want to see that image anyway though ;D

[@ryanxie7554]

it would be pretty ironic if it was taran editing it

[@gruffyddgozali]

ryan xie yeah

[@tchitchouan]

THE *VECTREX* was ahead of its time ! such an underrated console !

[@h7opolo]

that's what brought me to this vid. wanna understand the difference between a vector monitor and a rastered one.

[@WIImotionmasher]

I happened to be lucky enough to do some Vector drawing in middle-school so I happened to know about this. But I'm glad someone is covering this. It seems like most people don't understand / haven't heard of vector graphics.

[@jinchuriki009]

Adobe Illustrator 101

[@scrubby2]

coreldraw

[@jinchuriki009]

KINSLINK that one too.

[@riomigz1305]

CorelDraw master race

[@HermanWillems]

Fuck AI, InkScape! The best, and only the best.

[@3lH4ck3rC0mf0r7]

FL Studio, for example, has vectorized almost the entirety of their user interface, and you can scale it up to an obnoxious degree without it looking blurry due to linear pixel interpolation.

[@3lH4ck3rC0mf0r7]

***** Besides, using vectors allows you to literally reshape stuff into other stuff! Fl Studio uses this for some really sexy GUI animation that you just can't do properly using pixels. The knob from the Set property window is a perfect example of this.

[@TorturdChaos]

Vector graphics are wonderful for signs. Also very useful for vinyl cutters and CnC machines. Don't know where my sign shop would be without them.

[@peterwilkinson1975]

ba bum ptsh at the end :P

[@naota3k]

"Rimshot".

[@carljohnson9796]

naota3k "cumshot"

[@reigh7]

Speaking of enhance you should cover the ways Ai is now enhancing images taking low res raster images and adding details that we're not even captured accurately or editing motion in video to take a bad dancer or even just random movements of one person and mapping them to mimic the movements of a professional dancers video.

[@choiceonlinemarketinggroup8224]

Finally... a crystal clear explanation of vector artwork I can use :) Linus, I hope you don't mind but I embedded your video on my site.

[@ender_scythe2879]

Jokes on you, I don't need to rasterize my graphics, because I use a CRT, which is a vector screen. If anything, I need to vectorize my graphics.

[@naota3k]

Joke's on you, you use a CRT. #omgsojokes

[@ender_scythe2879]

What does "#omgsojokes" mean? The grammar hurts my brain.

[@naota3k]

Made up compound words don't have grammar. #rekt #0wn3d

[@ender_scythe2879]

It hurts my brain never the less.

[@naota3k]

Try being less sensitive to intentionally ridiculous jocular remarks.

[@ArclampSDR]

love the joke at the end ;)

[@sanderhonig8276]

Me too! It was so unexpected.

[@MikeeCZ]

Linus just a point about your videos sponsor - Pearl Auto is surerly great product but i was told it is not legal in every US state (it obstructs the register plate more than some states allow) I think that is a good thing to point out when recommending something

[@gamefillip9662]

Mikee CZ I mean he's Canadian so he doesn't really care about America

[@_Foxol]

Lmfao.

[@BitmapRadio1]

He might not have been made fully aware of that fact, especially since he's Canadian.

[@czechultimatestyle]

well if he is canadian why doesnt he say buddeeeh D: in every sentence

[@TheAyanamiRei]

Well if you notice he also doesn't end his sentences with "eh" either! I bet he's a transplant from America! IT'S THE ONLY RATIONAL EXPLAINATION!!

[@TheRecraftMan]

ive been drawing vector graphics for about half a year and i tell you, it can be a pain in the ass though. especially when you are a little bit of a perfectionist. i mean yes, every image looks extremely sharp. when you sketch something on paper and then "trace" it on your pc with vectorart every stroke always just as wide as the other if you want to. though when you try to connect different layers sometimes you just scroll in endlessly and TRY TO CONNECT THAT DAMN STROKE BUT THERE´S ALWAYS A GAP WHEN YOU ZOOM IN GODDAMN

[@dariensessions653]

i loved the little dance linus did during the AD "fancy pants feature" :P

[@chriswale7873]

Thanks Linus. Great explanation and very useful video.. I was going to share with the kids.. until the 4:20 bit :(

[@deadringer-cultofdeathratt8813]

420 hehe, NiCe 👍

[@ShadowGamer507]

Awesome video, helped me a lot w homework ... super cool you're Canadian too :D

[@mohammadhijazi4498]

the pearl auto thing is neat but for $500 they're charging a big premium for r&d and convenience

[@naota3k]

Or you could buy a 40 grand car and get it for free. Oh, that's why it's $500.

[@enhydralutra]

+naota3k My car cost way less than that and came with a rear view camera.

[@nimoy007]

Well done! I like nearly all of the Techquickies, but this one was especially well done, congrats.

[@Martin-hu1cr]

actually billboard have same resolution as display (+-72dpi) it was in test and i get 5. so i remember it now

[@morganminecraftlegion9101]

I think that the render of a person, converted to a scalable vector graphic, looks like a piece of art.

[@flyingarmadildo7748]

That outro is great !

[@Diegor35]

3:44, Put a beard, is Qain! Former Tek syndicate xD

[@melker6409]

Former... FeelsBadMan

[@James-712]

Yo my teacher shown this video in class without checking it hehe..

[@dej647]

4:25 ba dum tss

[@KarlNikolai]

lost internet for 2 months, so many videos to binge watch. hehehe. :D

[@Alkhaldi92]

That wink at the end 😂

[@mr.jbi2277]

4:26 .......did he..just..¿

[@sameersachan8427]

2:31" provided your gpu can render it" Yeah linus why not rub that on our face

[@twistymail]

I can find 200 other explanations exactly like this talking about raster and vector. I find it unbelievable that so many vector designations can actually be used to create a complex image. How is it done? I was searching for some detail as to how vectors are actually assigned and described in a finite amount of time and file space. No one seems to want to describe that, or they just don't understand it themselves, which is more likely.

I am still waiting for someone to invent the infinite resolution. A process that make vectors easy to use and making them ideal for all sorts of complex images. Imagine texturtes in games staying infinite sharp no matter how far you zoom in.

[@psylic]

So Linus just made a porn pun, oddly I'm not as surprised as I feel I should be if it were anyone else

[@CriticalHitsTHACO]

a great episode. and WOW. that has to be the first time i ever had the ad at the end of a video be the most "shut up and take my money" thing ever. great job linus.

[@jackhall27]

Love picking up my phone after school and seeing a new techquickie

[@FeTiProductions]

another point: even if a raster to vector conversion was done exactly, pixel by pixel, the amount of square vectors to mathematically group and process at this day and age is too great for the average computer to process let alone make a video out of

[@zeeshan5949]

this video really got me into thinking of my math book

[@sebbes333]

Would it be possible to make a hybrid between Vector and Raster graphics? Vectors for large simmple shapes and raster to add details to it?

[@FlandraLabs]

That camera sounds pretty good. Not in Canada though. There's like no light in the winter. Plus, my car is parked mostly in the garage or roofed parking anyways.

[@Felix-ve9hs]

is this Adobe Illustrator?

[@Felix-ve9hs]

LXVIS I guessed it cause I use it a my school

[@freakstate]

Felix R yes and it can also handle rastered files so it's the best of both worlds since you can temporarily fiddle with things with Photoshop and it will update in Illy too.

[@Mattia_98]

no, this is a video

[@islarf5095]

I was hoping this would be about vectors in game engines

[@Mebzy]

This is the only topic that my College talked about before Linus. (Thanks for all the early education. I hope it continues with other topics!)

[@GoodnessPC]

Choice of words and they way this guy plays with words! OMG!😱😍

[@shonawrites9472]

Hey! man you really did a great job this is super duper easiest video I found as last moment tuition thank you!🥰

[@bclark7113]

That pearl auto ad was actually pretty neat

[@coolmoviewatcher]

$500 for the rear view camera... cool... but that's super expensive...

[@mattw4211]

Ikr I would've bought one immediately for about $200, Id even consider it for $300. But $500? Yikes

[@bubblebat]

4:14 Is that a CTL-480 I see? Cookiezi would be proud.

[@GoldenKingStudio]

When I came to the video, there were no comments, but I went to another tab for a while before watching this one. Not commenting sooner is my greatest regret.

[@MrNoam64]

Wow ... i didn't expect to get to learn that much in so little time!

[@Mega_Arrow]

Wasn't this already uploaded a while back? I swear I've seen a techquickie video on vector images before.

[@SirBilliam96]

I think it's time for Techquickie to be in 4k, since LTT already is. What about y'all?

[@jimmeuht]

Sure even though i still watch all YT videos in 720

[@royalartisan2943]

Right!!! Thanks man helps out alot with my physical art too.

[@jammyh6007]

Perfect timing! I was just learning this in college

[@DJMYSTRO12]

That cheeky wink at the end

[@noahfischer6081]

the pearl auto thing sounds cool but heads up, it's $500

[@swaggytoast5242]

Noah Fletcher the turn of my head is free

[@SiimKuusik]

RearVision has been designed, marketed and sold for use by residents of the U.S. only. :( Actually looks pretty neat.

[@KamiDisturbed]

its funny linus makin a video about vector graphics when ive already knew them the first time i used macromedia flash mx in year 2004 or somth :D

[@Wren4123]

OMG thank you for the advertisement! that's totally a product I'd buy. but it's too expensive Dx

[@dino130395]

I'm gonna be totally honest. I'm really tech savvy... Almost as much as Linus... And I've known almost all of the things so far covered by Techquickie... And yet, here I am watching every video from beginning to end, just to support you guys! Keep up the good work, especially on LTT

[@casey6259]

That wink at the end though

[@haraldurkarlsson1147]

Well explained! I know that maps use shapefiles (vectors) and rasters (satellite images) etc. I wonder if turning the rasters into shapefile would not blow up my computer memory?

[@micah_noel]

I’m trying to create a version of my logo to send to a sticker printing company. In Inkscape, I have all of the components appearing to be vectors. I sacrificed a lot of detail from the version I use for web and I can zoom in on it indefinitely and it never pixelates. But when I send the .eps file they tell me it’s not a vector image. What am I doing wrong?

[@Jimmeyyyyy]

at 4:17 on the stock photo the word Address is misspelled

[@ride_with_me]

Perfectly explained. Thanks

[@kimmis15]

You're really good at this! Thanks

[@joshuastrozzi737]

That pun was perfect....good job

[@ameenal-kaisi3697]

Goddam it, you guys keep throwing me off with them intense puns.

[@KnowingEyes]

That last-second half-wink @ 4:26. ROFL.

[@hillppari]

That pearl thing is pretty stupid for plugging into ODB port. It only takes the power from there so you should be able to use 12v socket to do that.

[@VpBuilds]

That and older cars like mine (1984 bmw 533i) don't have OBD2 ports

[@vinno97]

hillppari I'm also wondering if it would be able to log exactly what the car was doing at each moment

[@mattw4211]

Can you not buy an adapter if its just power it needs?

[@Silver_o]

this is for it to know when your car is in the reverse gear to activate the camera and sensor. I don't think the camera would be on for the whole trip.

[@chiefdog6909]

You might want to mention that CAD is vector, and Quadro cards are built to handle vector graphics, and traditional Geforce/Radeon gaming/Photo editing cards are built for Raster graphics.

[@MrGameLandTV]

i wish you did this video a month ago as i studying about vector graphics

[@bfairifudare1964]

Is there a decent alternative to skip drawing vectors with a mouse or a finger on a laptop pad when you want to create a logo or an object in Graphic Design? Eg. Draw a logo or an object and then with one or few clicks you turn that into vector graphics?

[@lanekerr5272]

Vector Magic is phenomenal. Would highly suggest.

[@randospawn7495]

What if instead of just giving that strange quantization effect people could make one that samples multiple points on the original shape and then makes gradients using a vector to define how harsh the falloff of one color is.

[@MarkHidden]

I would have felt awkward about using rendering in this context without explaining it. One way to say it is line vs dots. A raster image is a set of dots, and a vector image is a set of lines. Drop shapes, because shapes are composed of lines, the primitive in this case are the lines. Lines vs Dots. A plotter is a good example of a vector machine. An ink jet printer is an example of a raster machine. You should get a Plotter and play with it... that would be fun... Bring in 3D graphics OMG. That is confusing... because for the most part 3D engines today are still a hybrid of raster and vector. I am not saying your wrong just saying hmmmm.

[@HeBeWorthy]

That pearl camera is pretty cool.

[@MichaelSodapop]

3:48 Bear Grylls again :P

[@blessedalldaynyc]

If I vectorize an image, do I have to save the file as svg or will it still be good at png? Thank you.

[@Endelite]

I'm imagining a situation with intense vector graphics use and wonder what would accelerate this process. When vector graphics are being drawn, such as in a webpage, can it utilize a GPU to help it do so and would that help, and please inform me, are ROPs or TMUs or Compute Units/SM used for it? If only the CPU can be used, it would hypothetically be possible for GPUs or another (new?) type of coprocessor/ASIC/FPGA to be made specifically for this sort of purpose, right?

[@esserlamp]

5:17 Umm, 3 years later there's no sign of that being there anytime "Soon"

[@natestickeler924]

No, all new cars in the US nowadays have to have them from factory. It's been that way since 2018.

[@catboy721]

A little late to the party, but a question -- at around 3:55 you're explaining that displays are raster devices. So how is it i possible to create vector images if you're doing it on a raster display? Aren't your polygons and beziers actually just pixelated representations? Thanks.

[@robp3358]

ENHANCE! Great Explanation!

[@goosebyte]

The ending before the sponsor....why do you do this to us Linus?

[@masterace1107]

Can you please make a video about NAT types?

[@adriancallme7170]

that photo linus.. you should be an action star

[@_pudu661]

Great explanation!!