JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 34
  • Score
    100M100P100Q52744F
  • License MIT

Generate a svg logo, then you can embed it in you README.md

Package Exports

  • logo.svg

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (logo.svg) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

logo.svg

Generate a svg logo, then you can embed it in you README.md

MIT License npm:

Feature:

  • Custom font, font size, letter spacing
  • Generate individual path for every char
  • Support any valid attributes and style
  • Handily cli

Install

$ npm install logo.svg -g

Usage

CLI

$ logo [options]

Options:

  -l, --logo ??? ............. The logo text. Default is the `name` of the `package.json`.
  -f, --font ??? ............. Specify the font path or url.
  -s, --fontSize ??? ......... Specify the font size. Default `72`.
  -o, --output ??? ........... Specify the output path. Default `logo.svg`
  -c, --config ??? ........... Specify the `.logorc` file.
  -O, --overwrite ............ Overwrite when a logo file exist. Default `true`.
  -k, --kerning .............. Take kerning information into account. Default `true`.
  -d, --divided .............. Generate individual path for every char. Default `false`.
  -V, --version .............. Print the current version.
  -h, --help ................. You're looking at it.
  -h, --help ??? ............. Show details for the specified command.

Examples:

  $ logo
  $ logo -Odo ./logo/logo.svg
  $ logo --config ./logo/.logorc
  $ logo --help
  $ logo --help font
  $ logo --help config
  $ logo --version

As a module

var logo = require('logo.svg');
// generate the svg string, then you can use it in you code
var svg = logo.generate(options);

Options

font

The font's path or full url. If it's an url, we will load the font asynchronous then generate the logo.

If the path is relative, it is relative to the current work directory(process.cwd()).

If the path is a basename, such as fontName.ttf, we will fisrtly try to load it as a relative path, if that failed we will search it from the preset folder, and then search it from system and user fonts folders.

The preset folder is ./fonts/, you can contribute yours by pull request.

The logo text. The name in package.json by default.

options for text2svg

All the options of text2svg are valid.

All the styling options of text2svg are valid.

.logorc

All the options can be specified in the following files:

  • .logorc.js
  • .logorc.yaml
  • .logorc.yml
  • .logorc.json
  • .logorc
  • The logo section in package.json

We will try to load configuration from these files order by order, stop until any file load succeed.

Example for .logorc:

font: Origami-Mommy-Pixellated.ttf
fontSzie: 72
output: logo.svg
# style the logo
path:
  fill: '#6ccb99'

Example for package.json:

{
  "name": "module",
  "version": "1.0.0",
 
  "logo": {
    "font": "Origami-Mommy-Pixellated.ttf",
    "fontSzie": 72,
    "output": "logo.svg",
    "path": {
      "fill": "#6ccb99"
    }
  },
  
}

SVG does not work from README by design for security concerns ...

We have had to disable svg image rendering on GitHub.com due to potential cross site scripting vulnerabilities.

So, we can not embed by the raw url, rawgit.com solves this problem nicely. For each request, it retrieves the appropriate document from GitHub and, crucially, serves it with the correct Content-Type header.

Link to your logo.svg using the following pattern:

https://cdn.rawgit.com/<repo-owner>/<repo>/<branch>/path/to.svg

To ensure that the CDN always serves the version of the file you want, use a git tag or commit hash in the file's path instead of a branch name, and update the URL if you push a new version of the file.

So, instead of a URL like https://cdn.rawgit.com/user/repo/branch/file, use a URL like https://cdn.rawgit.com/user/repo/tag/file or https://cdn.rawgit.com/user/repo/commit/file.

The embed code looks like:

![logo.svg](https://cdn.rawgit.com/<repo-owner>/<repo>/<branch>/path/to.svg)

<img alt="logo.svg" width="500" src="https://cdn.rawgit.com/<repo-owner>/<repo>/<branch>/path/to.svg">

Demos

npm

divided

blocked

square

gubblebum

  • text2svg Convert text to svg path.
  • loadrc Load runtime configuration files for your module.