Skip to main content

Home/ CSS Evangelist/ Group items tagged fonts

Rss Feed Group items tagged

Filter: All | Bookmarks | Topics Simple Middle
Jamil Silva

<!DOCTYPE html P - 3 views

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">   <!-- Thi...

theme tumblr isadora blanch cultura visual bigtheme

started by Jamil Silva on 01 Sep 12 no follow-up yet
yc c

Font Squirrel | Create Your Own @font-face Kits - 4 views

www.fontsquirrel.com/...generator

converter online free download tool font fontface generator

shared by yc c on 24 Jul 10 - Cached
Yuri Câmara liked it
  • yc c on 24 Jul 10
     
    download and/or convert fonts Upload a font and this will spit out everything you need to embed it into a website including HTML, CSS and multiple font file formats. You'll definitely want to bookmark this one! Each @font-face font kit come with: Original TrueType or OpenType Fonts for Firefox 3.5+ , Opera 10+, Safari 3.1+, Chrome 4.0.249.4+EOT fonts for Internet Explorer 4+Demo.html and stylesheet.css so you can get going fastNOTE: All fonts are subset to the Mac Roman char set.
Vernon Fowler

Font sizing with rem - Snook.ca - 0 views

snook.ca/...font-size-with-rem

css3 rem font css fonts sizing webdesign web design

shared by Vernon Fowler on 10 Sep 12 - No Cached
  • The problem with em-based font sizing is that the font size compounds. A list within a list isn't 14px, it's 20px. Go another level deeper and it's 27px!
  • The rem unit is relative to the root—or the html—element. That means that we can define a single font size on the html element and define all rem units to be a percentage of that. html { font-size: 62.5%; } body { font-size: 1.4rem; } /* =14px */ h1 { font-size: 2.4rem; } /* =24px */
  • We can specify the fall-back using px, if you don't mind users of older versions of Internet Explorer still being unable to resize the text (well, there's still page zoom in IE7 and IE8). To do so, we specify the font-size using px units first and then define it again using rem units. html { font-size: 62.5%; } body { font-size: 14px; font-size: 1.4rem; } /* =14px */ h1 { font-size: 24px; font-size: 2.4rem; } /* =24px */
  • ...3 more annotations...
  • I'm defining a base font-size of 62.5% to have the convenience of sizing rems in a way that is similar to using px.
  • consistent and predictable sizing in all browsers, and resizable text in the current versions of all major browsers
  • The compounding nature of em-based font-sizing can be frustrating so what else can we do?
Frederik Van Zande

8 Definitive Web Font Stacks [Design Tips & Tricks] - 0 views

www.sitepoint.com/...eight-definitive-font-stacks

css fonts typography font stack cross browser cross OS

shared by Frederik Van Zande on 07 Jan 09 - Cached
  • Frederik Van Zande on 07 Jan 09
     
    Over the last few months, I've spent more time than I intended on exploring the whole idea of fonts and typography for the Web. (My friend, typography expert Simon Pascal Klein, writes, "The former is a stylized set of glyphs of characters," while "the other [is] the whole art of creating type and setting it into the written word." For more clarification and illumination, consult Jon Tan and Mark Simonson.) In the process, I've been considering the idea of font stacks-using the well-known font-family CSS property-to list as many different fonts as possible in order to optimize the web site experience for a maximum number of users.
Vernon Fowler

Google Fonts - 0 views

www.google.com/fonts

fonts google web font typography tools

shared by Vernon Fowler on 10 Dec 13 - No Cached
  • Vernon Fowler on 10 Dec 13
     
    "A web with web fonts is more beautiful, readable, accessible and open. Google Fonts makes it quick and easy for everyone to use web fonts, including professional designers and developers."
kumar app

Top 300+ Themed Fonts of 2009 - 5 views

www.levoltz.com/...top-300-themed-fonts-of-2009

best movie music games themed fonts typography font

shared by kumar app on 07 Dec 09 - Cached
  • kumar app on 07 Dec 09
     
    Have you ever feel that traditional fonts are a little too boring and plain for your designs and artworks? Ever wanted to use fonts that are funkier, stylish and fun to look at? 2009 has been a rough ride for many of us, but typographically it has been a triumph. Unlike the serif font family, the
yc c

Font Tester - Online Font Comparison Tool - Preview Fonts - Compare Screen Type - 0 views

www.fonttester.com

css font preview tools

shared by yc c on 09 Mar 09 - Cached
  • yc c on 09 Mar 09
     
    Font Tester is a free online font comparison tool. It allows you to easily preview and compare different fonts side by side with various CSS font styles applied to them. It is very useful for web developers who are looking for just the right font/style/color to use in their pages. To use it all you have to do is simply enter the text you would like to preview, modify the various CSS properties until you find a style you like, and then click on the Get CSS Code button to generate all the necassary CSS code to reproduce those styles in your webpage.
abdullah khan

Find Fonts, Try Fonts, Buy Fonts « MyFonts - 2 views

new.myfonts.com

shared by abdullah khan on 11 Dec 09 - Cached
  • abdullah khan on 11 Dec 09
     
    Find, try, buy and download fonts from the world's largest collection of fonts online, and match your own fonts name.
Alexis Sgavel

Open Source Ampersands - 0 views

opensourceampersands.com/#how

ampersands open source fonts css3 tools reference online

shared by Alexis Sgavel on 13 Mar 11 - No Cached
  • Alexis Sgavel on 13 Mar 11
     
    This is a selection of single-character fonts. A single-character font is, literally, a font file that only contains glyphs for a single character. The single character in these font files is the ampersand. Each ampersand on this page is real text, not an image. Just like any text, you can select it, copy it, paste it, and apply CSS to it. The ampersands scale as you zoom the page, and they work in virtually every browser - even ancient versions of Internet Explorer.
Perry Branch

Common fonts to all versions of Windows & Mac equivalents (Browser safe fonts) - Web de... - 0 views

www.ampsoft.net/...WindowsMacFonts.html

cheatsheet design dm3105 font reference typography web

shared by Perry Branch on 11 Feb 08 - Cached
  • Perry Branch on 11 Feb 08
     
    Another thing to consider is that many Windows users have the Office suite or at least MS Word which comes with many fonts preslected for installation. Also look at the fonts used by OpenOffice and other popular opensource editors.

    These additional fonts are also good potential candidates for your font-family!

Frederik Van Zande

» 8 fonts you probably don't use in css, but should - Web Design Marketing Po... - 0 views

www.3point7designs.com/...bly-dont-use-in-css-but-should

arial black arial narrow century gothic css fonts impact palatino tahoma typography webdesign

shared by Frederik Van Zande on 10 May 08 - Cached
  • Frederik Van Zande on 10 May 08
     
    CSS has brought us many capabilities in terms of typography and the web, but we always seem to be limited to the same 4-5 typefaces over and over again. There is an inherant problem, if the font you specify isn't on the viewers computer it won't render in that font. So as designers and developers we end up selecting the ones that we can safely assume is available on most computers today. So most pages use Arial, Helvetica, or Georgia as their typefaces… and the world of the web remains slightly more bland.
Uzair Ahmed

Zen Elements Blog | CSS3 Embedding a Font Face - 0 views

www.zenelements.co.uk/...css3-embed-font-face

imported Bookmarks_Menu css

shared by Uzair Ahmed on 18 May 09 - Cached
  • Uzair Ahmed on 18 May 09
     
    Use CSS 3 @font-face to embed a font NOT on the 'web safe' list and get away from using images for headers. This will currently only work with certain browsers so again, there is our quick +/- list of compatible browsers.
Alexis Sgavel

How to Control Text Properties using jQuery and UI Slider - Script Tutorials - 0 views

www.script-tutorials.com/ext-animation-jquery-ui-slider

jQuery slider text typography javascript

shared by Alexis Sgavel on 05 Mar 11 - No Cached
  • Alexis Sgavel on 05 Mar 11
     
    Today I will tell how you can use jQuery to animate and control your text. We will changing font size, font family and other properties. Where we can use this? As example to allow your users to customize view of text boxes in your website. So, playing with styles - users will be able to select preferred styles, and you will need just save these styles for him, or, you can use this as some zoon for your website, which will allow to change font size in realtime. Also we will using jQuery slider to manipulate with properties to make it more interactive.
Vernon Fowler

Get Started with Font Awesome - 0 views

fontawesome.io/get-started

icons bootstrap font responsive accessible accessibility webdesign

shared by Vernon Fowler on 15 Jan 14 - No Cached
  • Super-simple upgrades Since each site gets a unique embed code, you can easily upgrade to the latest version of Font Awesome, all without pushing any code. Easy peasy.
Mr. Smith

Ajaxian » Towards Using Custom Fonts - 0 views

ajaxian.com/...towards-using-custom-fonts

fonts typography css webdesign tutorials

shared by Mr. Smith on 14 Jan 09 - Cached
  • Mr. Smith on 14 Jan 09
     
    custom fonts
Vernon Fowler

❍ IcoMoon - 0 views

icomoon.io

icons webdesign icon font fonts css vector custom builder generator

shared by Vernon Fowler on 17 Jan 14 - No Cached
  • Vernon Fowler on 17 Jan 14
     
    Custom Built and Crisp Icon Fonts, Done Right
thompsonmarry

Getting Started with Firefox extension - Diigo help - 0 views

help.diigo.com/...refox-add-on-quick-start-guide

Diigo Firefox

shared by thompsonmarry on 01 Oct 14 - No Cached
  •  Feature Highlight: Highlights Diigo saves the day with "highlights". Highlights let you select the important snippets on a page and store them in your library with the page's bookmark. Let's try it. Just open a page, maybe one of your old-school bookmarks or one of your new cat bookmarks, and find the information on that page you actually care about. Select that important text. Got it? Okay, now put your hemet on, 'cause this might blow your mind! Click the highlight icon on the Diigo toolbar. It's the one with the "T" on a page with a yellow highlighter. You will notice that the selected text gets a yellow background. This means that the text has been saved in your library, and as long as you have the Diigo add-on the text will be highlighted on the page! How's that for easy?   Now you've highlighted the text. It will appear in your library within the bookmark for the page it is on. Go to your library and you can see how it works. If you're not sure how to get to your library, just click the second icon on the toolbar (Diigo icon to the left of the search bar) and then select "My Library »".
  • Sticky Notes on the Web What? I can put a sticky note on a web page? How? Oh, that's right! Diigo. Just right-click anywhere on the page and choose to "add a floating sticky note". Type up your note and choose "Post", then move the note anywhere on the page. You have to type a note first, before you move it where you want, otherwise there's nothing to move!
Alberto Adrián Schiano

Graphics Lab - 0 views

www.cit.gu.edu.au/...graphics

buscar cli design disenyo fotos grafico graphic photos picture pintura search tutoriales tutorials visual

shared by Alberto Adrián Schiano on 30 Jun 07 - Cached
  • In this laboratory I perform various experiments in the realms of digital magick. Here I work with images, and 3D virtual spaces, as well as more traditional geometrical models to try and understand the graphical aspects of Computional Sorcery
    • Alberto Adrián Schiano
      Alberto Adrián Schiano on 30 Jun 07
       
      This site has one of the biggest collection of ImageMagick tutorials and examples. See what you need to do and search it here! Este sitio tiene una de las mayores colecciones de tutoriales sobre ImageMagick. Ver que necesitamos hacer y buscar aquí.
  • Alberto Adrián Schiano on 30 Jun 07
     
    Dealing with images and scripts to modify them Sobre imagenes y guiones que los modifican
1 - 20 of 73 Next › Last »
Showing 20▼ items per page