1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-12-23 01:30:01 +01:00
blog/content/articles/2008-10-23-the-finest-coffee-cups-most-incredible-coffee-icons-on-the-web/index.md
Matthias Kretschmann 299084de93
Gatsby → Astro (#829)
* basic astro setup, kick out all gatsby configs

* move content folder

* src/pages setup

* more file reorg

* more config updates

* more reorgs

* refactor

* refactor

* bump astro

* refactor

* svg icon build system, theme switch

* remark plugin for lead paragraph, more refactor

* make images work

* post meta

* custom Picture component

* Pagination, More component, 404 fixes

* linking fixes

* add table of contents

* post actions fixes

* tag fixes

* content changes

* content changes: move media files to their posts

* more content moving, remove media folder

* refactor remark-lead-paragraph

* link css file when defined in post frontmatter

* move content up again

* kbd post update

* allow js

* downloads solution

* add astro check

* redirect_from solution

* githubLink solution

* reorg

* exif solution as prebuild step

* exif solution on each post during build

* isolate lead paragraph extraction to articles

* restore Exif components

* deploy script update

* fix redirects

* xml & json feeds

* build fix

* fix exif readout in production

* head and seo tweaks, add feeds

* tweak image display

* archive pages with single layout

* restore tags archive

* sitemap setup

* restore thanks page functionality

* reorg

* cleanup

* parallel scripts during prebuild

* restore jest setup

* remove jest, switch to vitest as test runner

* adapt CI

* test refactor

* typescript tweaks

* avatar fixes

* typings

* restore search functionality

* theme switch with nanostores

* fixes

* test fixes

* restore changelog functionality

* umami script

* border color tweak

* related posts with fuse.js

* plawright e2e testing setup

* search tweaks

* simplify typekit loading

* photo fix

* e2e tests

* related posts fix

* fix tags archive

* tweaks

* tweaks

* linux snapshots

* fix header test

* new symlink tactic

* fix dev server in codespaces

* fix yaml

* ci fixes

* changelog loading tweaks

* e2e against dev server on ci

* changelog tweaks

* ci tweaks

* ci tweaks

* ci tweaks

* docs updates

* ci tweaks

* refactor photo creation script

* package updates

* refactor search

* ci tweak

* ci tweaks

* test tweaks, more unit tests

* more unit tests

* post creation script tweaks

* refactor new scripts, test them for real life

* more tests

* refactor

* codeclimate-action update

* uses update

* limit ci runs

* fix theme toggle, test it

* more tests

* favicon files cleanup

* icon components location change

* type checking through ci

* command fixes

* ci fix

* search tweaks

* ci tweaks

* revised favicons, write post draft about it

* drafts filtering fix

* lint fix, favicon fixes

* copy changes

* fix related search images

* content updates

* new codeblock styles, copy tweaks, fixes

* package updates

* typing fixes

* lint fix

* content updates

* restore link posts

* faster theme switching

* split up astro utils

* related posts fixes

* fix

* refactor

* fixes

* copy tweaks

* fixes

* picture tweaks

* image fixes

* feed fixes, adapt for json feed v1.1

* e2e test updates

* layout tweaks

* update snaphots

* migrate to createMarkdownProcessor

* ci cache tweaks

* activate more browsers for e2e testing

* switch to macos-13 images

* build caching tweaks

* markdown fix

* set image quality

* remove avif generation

* picture tweaks

* head fixes

* add og:image:alt

* create-icons test

* new post: Favicon Generation with Astro
2023-09-18 02:16:53 +01:00

160 lines
8.8 KiB
Markdown

---
title: The Finest Coffee Cups - Most Incredible Coffee Icons On The Web
author: Matthias Kretschmann
image: ./Teaser-Coffee-Cup-Icon.jpg
date: 2008-10-23 02:23:39+00:00
tags:
- design
---
In this article I present you the finest icons of the fuel of a lot of designers and students (and other people too) available on the web. I've just released [my own coffee cup icon](/coffee-cup-icon) but this beverage seem to have inspired a lot of other beautiful icons especially for Mac OS X.
Now just get your next coffee, sit back and enjoy this little showcase. Just click on the images to get to the icon sources. At the end of the article you'll find links to some nice high quality coffee tutorials. And remember you will have more control over time itself if you [reach your 100th cup of coffee](http://en.wikipedia.org/wiki/Three_Hundred_Big_Boys).
## The Finest Coffee Cups
Please note that these icons are the property of their respective owners and you should always consult their copyright notice first before using these icons.
## Coffee Cup icons by Susumu Yoshida
A bunch of colorful cups of coffee.
[![Coffee Cup icons by Susumo Yoshida](./coffee-showcase-susumo.png)](http://www.mcdodesign.com/?page_id=22)
## CoffeeCon icon by Vegrafik
A hyperrealistic icon from Vegrafik
[![CoffeeCon icon by Vegrafik](./coffee-showcase-vegrafik.png)](http://macthemes2.net/forum/viewtopic.php?id=16789993)
## Coffee Cup Icon by kremalicious
In a fit of megalomania I declared my icon as incredible and included it here. Originally I've made the coffee cup for the donations button on kremalicious.com.
[![Coffee Cup Icon by kremalicious](./coffee-showcase-kretschmann.png)](/coffee-cup-icon)
## Coffee folders from Agua Icons by David Lanham
The one and only Mac OS X system replacement icon set has some coffee folders too.
[![Coffee folders from Agua Icons by David Lanham](./coffee-showcase-lanham.png)](http://dlanham.com/art/agua/)
## Kaffe! icon from World of Aqua 3 icon set by Dave Brasgalla
Coffee in a metal cup. Sadly Dave didn't updated his World of Aqua icon pack with bigger sizes so it's just 128px.
[![Kaffe! icon from World of Aqua 3 icon set by Dave Brasgalla](./coffee-showcase-brasgalla.png)](http://iconfactory.com/freeware/preview/woa3)
## Starbucks coffee icon by Rok Benedik
[![Starbucks coffee icon by Benedik](./coffee-showcase-benedik.png)](http://benedik.deviantart.com/art/Starbucks-coffee-icons-96173293)
## Coffee folders from the Maji sets by Jonas Rask
Also Jonas used coffee as the metaphor for the work folder (supposedly) and made clear he likes very big coffee cups.
[![Coffee folders from the Maji sets by Jonas Rask](./coffee-showcase-rask1.png)](http://www.jonasraskdesign.com/medias/medias.html)
## Espresso icon by MacRabbit
Does this application need any introduction? Although not released yet the new web-coding application from MacRabbit drew a lot of attention. The icon is one of the reasons for that.
[![Espresso icon by MacRabbit](./coffee-showcase-macrabbit.png)](http://macrabbit.com/espresso/)
## Coffee folders from the Pry system sets by Jonas Rask
Another folder-combined-with-coffee icon by Jonas.
[![Coffee folders from the Pry system sets by Jonas Rask](./coffee-showcase-rask2.png)](http://www.jonasraskdesign.com/medias/medias.html)
## Coffee icons from Office Space icon set by VisualPharm
A glass coffee cup which is [wildly used](http://abduzeedo.com/amazing-photoshop-light-effect-10-steps) on the web. Created for Windows so the icons are just 256px in size.
[![Coffee icons from Office Space icon set by VisualPharm](./coffee-showcase-visualpharm.png)](http://www.visualpharm.com/office_space.html)
## The Coffee Shop icon set by Alejandro Lopez & Sergio Ruiz
An icon set made in collaboration between [Alejandro Lopez](http://www.dimensionofdeskmod.net/medias/) & [Sergio Ruiz](http://www.camtessadesign.com/descargas/ver/the_coffee_shop) with icons related to a coffee shop.
[![The Coffee Shop icon set by Alejandro Lopez & Sergio Ruiz](./coffee-showcase-lopezruiz.png)](http://RuizDesign.deviantart.com/art/The-Coffee-Shop-89457309)
## Espresso icon by Iiro Jäppinen
[![Espresso icon by Iiro Jäppinen](./coffee-showcase-jaeppinen.png)](http://iirojappinen.com/medias.html)
## Coffee Wallpaper by Michael Flarup
Not an icon but the coffee cup drawn in this wallpaper from Michael Flarup would make a good one. The detail of the cup is stunning.
[![Coffee Wallpaper by Michael Flarup](./coffee-showcase-flarup.png)](http://pixelresort.com/wallpapers/)
## Bean icon by Laurent Baumann
Bean is a free word processor for Mac OS X and Laurent Baumann included a nice coffee cup in the application icon for it.
[![Bean icon by Laurent Baumann](./coffee-showcase-baumann.png)](http://www.bean-osx.com/Bean.html)
## Have A Break icons by mat-u
Nice shiny coffee cups with a lot of detail in the reflections. Sadly just in 128px size maximum. Maybe you can [persuade mat-u to update this icon with bigger sizes.](http://www.mat-u.com/)
[![Have A Break icons by mat-u](./coffee-showcase-matu.png)](http://mat-u.deviantart.com/art/Have-A-Break-Icons-54326598)
## Java Application icons by Apple
Apple uses a nice coffee cup in their Java applications which can be found in the Utilities folder. Thanks to [David](http://dlanham.com/) for pointing this out.
![Java Application icons by Apple](./coffee-showcase-apple.png)
## Caffeine icon by Trevor Kay
Trevor Kay made the new icon for Caffeine. This application prevents your Mac from automatically going to sleep. Trevor also made [some additional icons for Caffeine](http://God-X.deviantart.com/art/Caffeine-Replacement-Icons-75619389) although the coffee cup looks pretty much the same as the one from Apple's Java application icons.
[![Caffeine icon by Trevor Kay](./coffee-showcase-kaycaffeine.png)](http://lightheadsw.com/caffeine/)
## Coffee and Tea icons by Kate England
Some comic style icons which deviate from the realism of all the other coffee icons. Sadly just available in 128px size.
[![Coffee and Tea icons by Kate England](./coffee-showcase-england.png)](http://iconfactory.com/freeware/preview/cofe)
## Moon Coffee icon from Space: 1999 icon set by Dave Brasgalla
Dave made an icon set for the Iconfactory inspired by the classic sci-fi television series of the 70's and included a Moon Coffee cup. Also just in 128px size.
[![Moon Coffee icon from Space: 1999 icon set by Dave Brasgalla](./coffee-showcase-brasgalla2.png)](http://iconfactory.com/freeware/preview/1999)
## Times Application Icon by Mikio Inose
Acrylic Software's "new type of newsreader for Mac OS X Leopard" called [Times](http://www.acrylicapps.com/times/) uses a gorgeous icon made by Mikio Inose.
[![Times Application Icon by Mikio Inose](./coffee-showcase-times.png)](http://www.mikworks.com/clientwork/times/)
## Do you love Cappuccino? by Creative 9 Design
One delicious full and one empty cappuccino cup re available in this icon set made by Creative 9 Design. Available just in 256px from their [blog](http://www.c9-d.com/blog/view/63).
[![Do you love Cappuccino? by Creative 9 Design](./coffee-showcase-lovecappu.png)](http://www.c9-d.com/blog/view/63)
## Cappuccino Framework Icon by Sofa
Not a coffee cup but also very coffee related is this awesome Cappuccino machine icon (although it shows an Espresso machine) made by [Sofa](http://www.madebysofa.com) for the Cappuccino framework.
[![Cappuccino Framework Icon by Sofa](./coffee-showcase-cappuccinosofa.png)](http://cappuccino.org/)
## Coffee Tutorials
Finally here're some nice high quality tutorials for you to help you build your own coffee cup.
- ![Using Gradients to Make Light and Shadow - and a Coffee Cup](./coffee-showcase-tut-psdtuts.png)
[Using Gradients to Make Light and Shadow - and a Coffee Cup!](http://psdtuts.com/tutorials-effects/using-gradients-to-make-light-and-shadow-and-a-coffee-cup/): Collis from [psdtuts](http://psdtuts.com) made a nice tutorial with a similar perspective as found in [my Coffee Cup Icon](http://www.kremalicious.com/goodies/).
- ![Design A Coffee Mug Icon](./coffee-showcase-tut-houle.png)
[Design A Coffee Mug Icon](http://www.myinkblog.com/2008/08/02/design-a-coffee-mug-icon/): Photoshop tutorial by Andrew Houle for creating a coffee cup icon.
- ![Creating a Coffee Cup with Inkscape](./coffee-showcase-tut-vectuts.png)
[Creating a Coffee Cup with Inkscape](http://vectortuts.com/illustration/creating-a-coffee-cup-with-inkscape/): Peter Anglea with a nice vector tutorial using the open source vector app Inkscape.
- ![Amazing Photoshop Light Effect In 10 Steps](./coffee-showcase-tut-abduzeedo.png)
[Amazing Photoshop Light Effect In 10 Steps](http://abduzeedo.com/amazing-photoshop-light-effect-10-steps): Not an icon tutorial but Fabio Sasso achieves some awesome light effects combined with the coffee cup from the [Office Space icon set](http://www.visualpharm.com/office_space.html).