Hand-coded SVG icons

Whenever possible, I prefer to draw icons for my projects using SVG. I write the code in a text editor. It is possible to export vector drawings from Adobe Illustrator to SVG, and I have created a few icons that way. But I didn't create any of these in that way.

Click on any SVG thumbnail to see a larger version.

Compass

For my map art app.

Gear

For settings, tools, or other technical applications.

Mission

Mission College. The font is not exactly the same, and may not appear correctly on all systems unless they have the Century Gothic font.

Banjo

For a music app or web site.

Gauge

For a design piece done in steampunk style. This icon uses font text, so its appearance may depend on the available fonts.

Radio Dial

For a design piece done in steampunk style. This icon uses font text, so its appearance may depend on the available fonts.

Safari

Attempt to reproduce the Safari icon in raw SVG.

Finder

Attempt to reproduce the new Yosemite Finder icon in raw SVG.

Earthquake

For a disaster preparedness web site. I generated the data using JavaScript.

Girl Power

For a web project.

My Logo

My MB logo used on my web site and portfolio.

Tools

For a tool, tool box, or utility program.

Comics

For a comics page.

Camera

A camera icon anchored by the colors red, green, and blue.

Piano Keys

For a concert poster.

Two Pianos

For a concert poster.

Meter

For a pollen tracking web site.

Philippians

For a generic web site. I used it for a class I'm teaching. This version uses the Biblical number seven.

Edit

For a database access program.

Palette

For an art project or color code site.

Keyboard

For a music program.

Roads

For a mapping project.

Transistor

For an electronics project.

Transistor

For an electronics project.

Colors

Color wheel based on the red-green and blue-yellow axes. For an art project or color code site.

Calso

Oil company icon based on a map graphic. Icon for a mapping program.

Chevron

Oil company icon based on a map graphic. Icon for a mapping program.

Calendar

For a calendar link. I use this on my home page.

PHP

An icon for my PHP class.

Diamond

An icon for a square dance application.

SVG/JS

An icon for a square dance application. This icon uses font text, so its appearance may depend on the available fonts.

Book

An icon for a bookmark or reading application.

Atom

An icon for a chemistry application.

Benzene

An icon for a chemistry application.

Basketball

An icon for a game.

Resistor

An icon for an electrical app, such as a resistor color decoder.

Delta

An icon for an electrical app.

Delta

An icon for an electrical app.

Lissajous

An icon for an electrical app.

Cookie

An icon for a fortune cookie app.

iPad

An icon for an iPhone or iPad app.

iPhone

An icon for an iPhone or iPad app.

Scale

An icon for a health app such as a BMI calculator.

Star Burst

An icon for a welding app.

Devices

An icon for a responsive site or app.

Ruler

An icon for a measurement site or app.

More SVG Projects

Dynamic SVG Projects
SVG Doodles
Highway Signs
large