Generate custom icon webfonts from SVG files via Grunt. Inspired by Font Custom. This task will make all you need to use font-face icon on your website: font in all needed formats, CSS/Sass/Less/Stylus and HTML demo page.
https://github.com/sapegin/grunt-webfontTags | gruntplugin font webfont fontforge font-face woff woff2 ttf svg eot truetype css icon |
Implementation | Javascript |
License | MIT |
Platform | NodeJS |
This service might be handy if you want to directly download all .eot, .woff, .woff2, .svg, .ttf files of a Google font (normally your User-Agent would determine the best format at Google's CSS API). Furthermore it provides charset customization and CSS snippets, hence getting your fonts ready for local hosting should be finally a breeze. The API is public, feel free to use it directly.
google-fonts web-fonts download woff svg ttf woff2 eot css snippet hostingOffice Code Pro is a customized version of Source Code Pro, the monospaced sans serif originally created by Paul D. Hunt for Adobe Systems Incorporated. The customizations were made specifically for text editors and coding environments, but are still very usable in other applications.Available Formats OpenType, TrueType, EOT, WOFF, WOFF2 – OpenType ( OTF ) is the recommended font format for desktop use. The TrueType ( TTF ) fonts will work in most circumstances, but are optimized and recommended as webfonts. EOT, WOFF, and WOFF2 formats are exclusively for web use.
Web font downloader/inliner. Downloads a set of web fonts specified by @font-face rules in a CSS file. By default, woff equivalents are inlined as the modern browsers all support it. See the note about WOFF2 below.
webfont generator - converts ttf to woff, eot and svg
Create SVG/TTF/EOT/WOFF/WOFF2 fonts from several SVG icons with Gulp. You can test this library with the frontend generator.
gulpplugin gulp icon fontFont Face Observer is a small @font-face loader and monitor (3.5KB minified and 1.3KB gzipped) compatible with any webfont service. It will monitor when a webfont is loaded and notify you. It does not limit you in any way in where, when, or how you load your webfonts. Unlike the Web Font Loader Font Face Observer uses scroll events to detect font loads efficiently and with minimum overhead. The FontFaceObserver constructor takes two arguments: the font-family name (required) and an object describing the variation (optional). The object can contain weight, style, and stretch properties. If a property is not present it will default to normal. To start loading the font, call the load method. It'll immediately return a new Promise that resolves when the font is loaded and rejected when the font fails to load.
webfonts fontfaceobserver font-loading web-fonts fontloader fonts font font-face web-font font-load font-eventsWe like SVGs and we think they're the way to display icons on the web. Since Open Iconic are just basic SVGs, we suggest you display them like you would any other image (don't forget the alt attribute). Open Iconic also comes in a SVG sprite which allows you to display all the icons in the set with a single request. It's like an icon font, without being a hack.
icon iconic open-iconic svg sprite font png webpThe missing font generator for Mac OSX. Download here. FontPrep takes your TTF and OTF font files and generates all of the respective font-formats for the web: WOFF, EOT, and SVG.
Use with any existing @font-face declaration. Include the library. Call the JavaScript.
font web-fonts css gruntThis font is derived from the x3270 font, which, in turn, was translated from the one in Georgia Tech's 3270tool, which was itself hand-copied from a 3270 series terminal. I built it because I felt terminals deserve to be pretty. The .sfd font file contains a x3270 bitmap font that was used for guidance. If you are running Debian or Ubuntu and you don't want to mess with building your font files, you can simply apt-get install fonts-3270 (It's available from the Debian (https://packages.debian.org/sid/fonts/fonts-3270) and Ubuntu (http://packages.ubuntu.com/zesty/fonts-3270) package repos at https://packages.debian.org/sid/fonts/fonts-3270 and http://packages.ubuntu.com/xenial/fonts/fonts-3270, although the packaged version may not be the latest version, but it's good enough for most purposes. For those who don't have the luxury of a proper system-managed package, Adobe Type 1, TTF, OTF and WOFF versions are available for download on http://s3.amazonaws.com/3270font/3270_fonts_b3b4b7d.zip (although this URL may not always reflect the latest version).
font fontforge ibm font-files sfd programming-font programming-fonts typography mainframeYou can incrementally search for Font Awesome icons and paste it to front most app. 💎 See also: Font Awesome Workflow with Sketch 3 — QuickCast.
fontawesome font-awesome icons webfont font css svg-icons alfred alfred-workflow sketch illustrator photoshopCanvas is a common vector drawing target that can output SVG, PDF, EPS, raster images (PNG, JPG, GIF, ...), HTML Canvas through WASM, OpenGL, and Gio. It has a wide range of path manipulation functionality such as flattening, stroking and dashing implemented. Additionally, it has a text formatter and embeds and subsets fonts (TTF, OTF, WOFF, WOFF2, or EOT) or converts them to outlines. It can be considered a Cairo or node-canvas alternative in Go. See the example below in Figure 1 for an overview of the functionality. Figure 1: top-left you can see text being fitted into a box, justified using Donald Knuth's linea breaking algorithm to stretch the spaces between words to fill the whole width. You can observe a variety of styles and text decorations applied, as well as support for LTR/RTL mixing and complex scripts. In the bottom-right the word "stroke" is being stroked and drawn as a path. Top-right we see a LaTeX formula that has been converted to a path. Left of that we see an ellipse showcasing precise dashing, notably the length of e.g. the short dash is equal wherever it is on the curve. Note that the dashes themselves are elliptical arcs as well (thus exactly precise even if magnified greatly). To the right we see a closed polygon of four points being smoothed by cubic Béziers that are smooth along the whole path, and the blue line on the left shows a smoothed open path. On the bottom you can see a rotated rasterized image. The result is equivalent for all renderers (PNG, PDF, SVG, etc.).
svg pdf opengl canvas html-canvas cairo path rasterizer vector-graphics epsYou can find a demo GUI here. This project was initiated by the need to read font files in the DOMPDF project.
font font-files extract truetype woff ttfCryptocoins is the most complete free vector iconpack of your favourite cryptocurrencies. Available in webfont & SVG format for taking advantage of small file sizes and unlimited scalability, Cryptocoins are perfect for usage on the web – right where they belong. Use them all or just the ones you need.
cryptocurrency cryptocoins money icons icon-pack cryptocurrencies cryptocoin bitcoin ethereum crypto iconPlease ★ this library. Now, you don't have to download different libraries to include different font icons. This SwiftIcons library helps you use icons from any of the following font icons.
fonts font-awesome fontawesome ionic map-icon material-icons linearicons open-iconic font-icons ttf dripicons ionicons state-face weather-icons icons icofont google-material-icons swift4 iosA set of icons for displaying a visual ("analog") representation of time stamps. The Analog Clock icon set allows <time> elements to have a visual notation in a simple, progressive way using a @font-face to deliver a custom font for the clock face. The icon is therefore scalable and can be styled with CSS to match most site designs.
Awesome SVG icon component for Vue.js, with built-in Font Awesome icons. Vue-Awesome an SVG icon component for Vue.js, with built-in icons courtesy of Font Awesome.
icon vue svg font-awesome vue.js
We have large collection of open source products. Follow the tags from
Tag Cloud >>
Open source products are scattered around the web. Please provide information
about the open source projects you own / you use.
Add Projects.