Support

Work

@font-face

 •  CSS3 @font-face example


 @font-face :: Format --- {universal declaration works in ALL browsers}
 -----------------------------------------------------------------------
 @font-face {font-family:'myfontFamily',(type);
    src: url('./myfont-webfont.eot');                           (1)
    src: url('./myfont-webfont.eot?iefix') format('eot'),       (2)
         url('./myfont-webfont.woff') format('woff'),           (3)
         url('./myfont-webfont.ttf')  format('truetype'),       (4)
         url('./myfont-webfont.svg#svgFontName') format('svg'); (5)
  font-size:12px; font-style:normal; font-weight:400;
  text-shadow:none; text-decoration:none; text-transform:none;
  letter-spacing:0em; word-spacing:0em; line-height:1.2; color:#333333;}
 -----------------------------------------------------------------------
 Notes:
 font-family: (type) [serif|sans-serif|monospace|script|cursive|display]
 
 1: IE9 Compat Modes     2: IE6-IE8     3: Modern Browsers
 4: Safari,Android,iOS   5: Legacy iOS                        
 -----------------------------------------------------------------------

/* --- Font 01a : Gentiumr   ----- Sans-Serif - Regular ------------- */
@font-face {font-family:'Gentiumr',sans-serif;
   src: url('./genbasr-webfont.eot');  
   src: url('./genbasr-webfont.eot?iefix') format('eot'),
        url('./genbasr-webfont.woff') format('woff'),
        url('./genbasr-webfont.ttf') format('truetype'),
        url('./genbasr-webfont.svg#webfontSGeIlxzy') format('svg');
 font-style:normal;font-weight:400;text-shadow:none;text-decoration:none;
 text-transform:none;letter-spacing:0em;word-spacing:0em;line-height:1.2;}  
/* --- Font 01b : Gentiumi   ----- Sans-Serif - Italic  ------------- */
@font-face {font-family:'Gentiumi',sans-serif;
   src: url('./genbasi-webfont.eot');  
   src: url('./genbasi-webfont.eot?iefix') format('eot'),
        url('./genbasi-webfont.woff') format('woff'),
        url('./genbasi-webfont.ttf') format('truetype'),
        url('./genbasi-webfont.svg#webfontJCDMG4Yu') format('svg');
 font-style:italic;font-weight:400;text-shadow:none;text-decoration:none;
 text-transform:none;letter-spacing:0em;word-spacing:0em;line-height:1.2;}
/* --- Font 01c : Gentiumb   ----- Sans-Serif - Bold   -------------- */
@font-face {font-family:'Gentiumb',sans-serif;
   src: url('./genbasb-webfont.eot');  
   src: url('./genbasb-webfont.eot?iefix') format('eot'),
        url('./genbasb-webfont.woff') format('woff'),
        url('./genbasb-webfont.ttf') format('truetype'),
        url('./genbasb-webfont.svg#webfontii3upMsM') format('svg');
 font-style:normal;font-weight:700;text-shadow:none;text-decoration:none;
 text-transform:none;letter-spacing:0em;word-spacing:0em;line-height:1.2;}
/* --- Font 01d : Gentiumbi  ----- Sans-Serif - BoldItalic ---------- */
@font-face {font-family:'Gentiumbi',sans-serif;
   src: url('./genbasbi-webfont.eot');  
   src: url('./genbasbi-webfont.eot?iefix') format('eot'),
        url('./genbasbi-webfont.woff') format('woff'),
        url('./genbasbi-webfont.ttf') format('truetype'),
        url('./genbasbi-webfont.svg#webfont2YFzkHwu') format('svg');
 font-style:italic;font-weight:700;text-shadow:none;text-decoration:none;
 text-transform:none;letter-spacing:0em;word-spacing:0em;line-height:1.2;}

 p.f01a {font-family:'Gentiumr';font-size:12px;color:#333333;}
 p.f01b {font-family:'Gentiumi';font-size:12px;color:#990000;}
 p.f01c {font-family:'Gentiumb';font-size:12px;color:#009900;}
 p.f01d {font-family:'Gentiumbi';font-size:12px;color:#000099;}

WebFonts

 •  WebFonts is a large file .... may take 1 to 2 minutes to load.
 •  WebFonts is a small sample 12 Font Families with 125 font examples to view.


 Fonts :: Sans-Serif
 -----------------------------------------------------------------------
 Gentium Basic          Regular   Italic   Bold   BoldItalic                 
 Gentium Book           Regular   Italic   Bold   BoldItalic                 
 Gentium Plus           Regular   Italic   ----   ----                       
 Gentium Plus Compact   Regular   Italic   ----   ----                        
 Liberation Sans        Regular   Italic   Bold   BoldItalic                   
 DejaVu Sans            Book      Oblique  Bold   BoldOblique                
 Droid Sans             Regular   ----     Bold   ----                       
 WalkwayRegular         SemiBold  Bold     UltraBold    Black                
 WalkwayOblique         SimiBold  Bold     UltraBold    Black   Oblique     
 GreyscaleBasic         Regular   Italic   Bold   BoldItalic                 
 CharisSIL              Regular   Italic   Bold   BoldItalic                 
 CharisSILCompact       Regular   Italic   Bold   BoldItalic                 
 CreditValley           Regular   Italic   Bold   BoldItalic                 
 CreditRiver            Regular   ----     ----   ----                       
 LatinModern Sans       Regular   Italic   Bold   BoldItalic    Other(s)    
 
 Fonts :: Serif
 ----------------------------------------------------------------------- 
 Liberation Serif       Regular   Italic   Bold   BoldItalic                 
 DejaVu Serif           Book      Italic   Bold   BoldItalic                 
 Droid Serif            Regular   Italic   Bold   BoldItalic                 
 LatinModern Roman      Regular   Italic   Bold   BoldItalic    Other(s)    
 
 Fonts :: Monospace
 -----------------------------------------------------------------------
 Liberation Mono        Regular   Italic   Bold   BoldItalic                 
 DejaVu Mono            Book      Oblique  Bold   BoldOblique                
 Droid Mono             Regular   ----     ----   ----                       
 LatinModern Mono       Regular   Oblique  Bold   BoldOblique   Other(s)    
  
 Fonts :: Condensed
 -----------------------------------------------------------------------
 DejaVuSans  Condensed  Book      Oblique  Bold   BoldOblique                
 DejaVuSerif Condensed  Book      Italic   Bold   BoldItalic                 
 
 Fonts :: Web
 ----------------------------------------------------------------------- 
 DejaWeb                Regular   Italic   Bold   BoldItalic                   

 Fonts :: Script
 -----------------------------------------------------------------------
 MarketingScript        Regular   ----     ----   ----                       
  
 Fonts :: Display
 -----------------------------------------------------------------------
 Laconic                Regular   Light    Bold   Shadow                     
 Orbitron               Light     Medium   Bold   Black