Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Setting CSS font-family to a safe handwriting font

Tags:

In CSS, I usually go with the usual

font-family: Arial, Helvetica, sans-serif; 

For a little change, I'm going for a font that looks like handwriting. Can some of the expert CSS folks here suggest what would be some of the safest fonts (most widely available in most browsers) that look like handwriting?

like image 883
dmontain Avatar asked Apr 30 '10 20:04

dmontain


People also ask

What is the best way to use the font-family CSS property?

Start with the font you want, and always end with a generic family, to let the browser pick a similar font in the generic family, if no other fonts are available. Note: Separate each value with a comma. Note: If a font name contains white-space, it must be quoted.

Which CSS font-family has clean lines with no small strokes attached?

Sans-serif fonts have clean lines (no small strokes attached). They create a modern and minimalistic look.


2 Answers

Similar to sans-serif there is a generic cursive that it a "font that resembles handwriting". This will vary by browser (as will sans-serif) but could be a good place to start.

Here is a survey of script family fonts installed per user (year 2012):

Cursive font sampler and survey results

They all look significantly different from each other so you'd lose some consistency, but some are quite widely adopted.

Their main installed fonts are (FOR WINDOWS ONLY):

Comic Sans MS       99.13%   Monotype Corsiva    82.29%   Bradley Hand ITC    63.02%  Tempus Sans ITC     62.68%  French Script MT    62.39% 
like image 92
Alex Mcp Avatar answered Oct 07 '22 01:10

Alex Mcp


You could use one of the Google web safe fonts: http://www.google.com/webfonts/family?family=Schoolbell&subset=latin#code

<link href="https://fonts.googleapis.com/css?family=Schoolbell&v1" rel="stylesheet">  h1 {     font-family: 'Schoolbell', arial, serif;  } 
like image 21
adjwilli Avatar answered Oct 07 '22 02:10

adjwilli