Working out the font/font size of text on webpages

[ohlalalaura]

Weird question but one of which I've been wondering for ages and now I've signed up have the opportunity to ask.

Is there a specific program or even just a way of extracting the font/font size/font colour from webpages? Sort of like a colour picker but for fonts?

Whenever I paste something into a program like Frontpage or Word it just converts it into the default Times New Roman font =(

[fo3nix]

the easiest thing to do is just open the page's CSS (or just plain HTML if an older site, or more badly designed), and look for what fonts are used there together with colours.

if you want to do this, i'd recommend using this firefox plugin to make your job a whole lot easier:
https://addons.mozilla.org/extensions/moreinfo.php?id=697

[gary baldy]

The programs you paste in will only have a limited amout of fonts installed. It is possible that a specific font from a web site will not be in your font book - hence the default to TNR. You should be able to change that default but only to one of those you have in your font book. Graphic designers use all types of fonts that they have paid good money for where as your average home computer will have a limited range pre-installed.

[boobesque]

right click on the web page in question and click on the option to view source (works on aol and internet explorer. other browsers have different ways but they all let you view the source). hunt the page for '<font size="16">' or whatever size it may be. this is usually located near the top of the page. if you are looking at a site that has hundreds of pages this may not be on any individual webpages as they would probably prefer to use css. and for fo3nix. websites arent badly designed or old if they dont use css. css standardises the website which is good if thats what you want. for some sites it is just quicker to add the properties into the html.

[stevie21]

Sadly that plugin of fo3nix's (and various others) doesn't work with the latest release of Firefox.

I thought it looked really handy and tried to install it :(

[fo3nix]

boobesque: I see your point that putting it into the HTML may be slightly faster, but not much. And it totally ruins the semantics of the site, hence why it is bad. HTML is a markup language designed to define structure. The font colors etc. were added later as there was no thought to CSS at that time; this is not what it was designed for. HTML should handle structure, CSS presentation, and JavaScript any dynamic components.

Stevie: argh, you're right. didn't notice that, I don't use it daily. I'm sure it'll be updated soon though. If you know what you're doing you could download it and force it to work with 1.5 (though there may be some bugs, probably not though). I'm sure it'll be updated soon enough though.

[Ralph]

fo3nix & stevie21 (& anyone else interested), the second user comment on the page for that extension gives instructions on how to make the extension work on Firefox 1.5. I've tried it and it's easy and it works fine. It's a great extension, very educational, thanks fo3nix!

[stevie21]

OK Ralph, great. I tried that and couldn't get it to work so I've just reverted back to an older version of Firefox.

That way my Calendar works again too :-)

To the original question, I often use this page to pick out colours :
http://www.w3schools.com/html/html_colornames.asp
That's when I'm not just stealing other people's colour schemes.

The Firefox plugin which shows "formatted" source code will tell you exactly what font, colour and size any text is if you know what to look for (and that's not hard).