Vector Graphics:
- Vector Graphic is the creation of digital images through a sequence of commands or mathematical statements. This file is composed of paths or lines that are either straight or curved. Ex: AI, CDR and SVG.
- Raster images also known as bitmaps, are comprised of individual pixels of colors. Each color pixel contributes to the overall image so it is pixelated.
- Raster image depends on its size and quality. Ex: GIF, JPG and PNG.
- Vector graphic images defines in xml format and every element and every attribute in vector graphic files is animated.
- Vector Graphic file is small in size and highly scalable. It can be scaled larger size without loosing any image quality, these are not pixelated.
- If you blow up a raster graphics it will look blocky, raster images are pixelated.
- Vector Graphic files are working in different resolutions and this file is resized as we needed without loosing sharpness.
Why Vector Graphics?
Scalable: Vector graphics are resized. It can be scaled larger size without loosing any image quality and sharpness.
Versatility: We will get clear images in any size and resolutions that can behave like other different image formats.
Styling and Symbols: SVG elements can be styled using css depending on what you need.
Performance and Accessibility: SVG have major benefits over other graphical formats means SVG carrier far less information, SVG have web safe fonts so performance and accessibility will increases.
Examples:


