Here is the quick and dirty of it though. This works in a the same way as @font-face does.

1) Go here (http://code.google.com/apis/webfonts/).
2) Click on font-directory beta button
3) Find a font you like and click on the ‘Click to embed…’ link
4) Click on get the code
5) Copy and paste the link tag into your document’s head

Example:

<link href='http://fonts.googleapis.com/css?family=Cantarell' rel='stylesheet' type='text/css'>

6) Add the font-family to the style sheet

Example:

h1 { font-family: 'Cantarell', arial, serif; }

And you are done.

This is in beta right now, so they only have about 20 fonts right now. So at the moment, I will still be using Fontsquirrel.com(http://www.fontsquirrel.com/) and @font-face. But once Google’s Font Directy grows, this will probably be my go to place for custom fonts.

$('p').text('Hello from The Web Machine');