Material-design-icons: Repo missing new themes

Created on 16 May 2018  路  11Comments  路  Source: google/material-design-icons

Would be great to have the four new icon themes available as SVGs in this repo; outlined, rounded, two tone, and sharp.

Most helpful comment

773 is asking for google font support. This issue is requesting that the new theme assets be added to this repo. (SVGs etc)

All 11 comments

duplicates #773

773 is asking for google font support. This issue is requesting that the new theme assets be added to this repo. (SVGs etc)

@tylerhowarth thanks for clarifying. However I don't get the difference from just reading both issues. I think the intention is the same: We would like to use the new themes (listed in either issue).

The other issue is asking about font files hosted on the Google font API server, for use on public sites. (The font API server probably doesn't actually have a public issue tracker?) This issue is asking for individual icon assets to be added to this repo, SVG/PNG, like what's already available for the original style.

Would like to add my voice to this, unsure why they aren't available yet. An estimate date would be lovely 馃憤馃徎

I want that also

+1

It's weird that you can download some themed icon svg's from the icon tool, but can't get them from the repo (or npm package). I made a small script to automate downloading desired icons from the tool:

https://gist.github.com/Igonato/525a04eb47cff0cd2cca3a7b0eec2413

// Some themed icons .svg's aren't available in the github repo and can only
// be donwloaded from https://material.io/tools/icons
// This script automates the download
const fs = require('fs')
const https = require('https')
const path = require('path')


// Where to save downloaded icons
const DEST_FOLDER = path.resolve(__dirname, 'src', 'icons')
if (!fs.existsSync(DEST_FOLDER)){
  fs.mkdirSync(DEST_FOLDER);
}

// List icons you want to get in ['icon_name', 'style'] format
const ICONS_TO_GET = [
  ['account_balance_wallet', 'baseline'],
  ['account_balance_wallet', 'outline'],
  ['account_balance_wallet', 'round'],
  ['account_balance_wallet', 'twotone'],
  ['account_balance_wallet', 'sharp'],
  /* ... */
]

// Get svg download link
let iconUrl = (icon, style='baseline') =>
  `https://material.io/tools/icons/static/icons/${style}-${icon}-24px.svg`

// Path to save to
let iconFilePath = (icon, style='baseline') => path.resolve(
    DEST_FOLDER,
    style === 'baseline' ? `${icon}.svg` : `${icon}_${style}.svg`
  )

// Download (thanks https://stackoverflow.com/a/22907134/723891)
let download = function(url, dest, cb) {
  let file = fs.createWriteStream(dest);
  https.get(url, function(response) {
    response.pipe(file);
    file.on('finish', function() {
      file.close(cb);  // close() is async, call cb after close completes.
    });
  }).on('error', function(err) { // Handle errors
    fs.unlink(dest); // Delete the file async. (But we don't check the result)
    if (cb) cb(err.message);
  });
};

// Download each icon (if it wasn't already)
ICONS_TO_GET.forEach(([icon, style]) => {
  let path = iconFilePath(icon, style)
  if (!fs.existsSync(path)) {
    download(iconUrl(icon, style), path)
  }
})

Any update on this request? I cannot understand why the icon tool offers more themes than the open-source repo. Thanks.

This repository is not maintained. I suspect its because:

  • This repository is used for font. Font can't have opacity in icons, but many of new icons have opacity.
  • Too many different formats in one repository. Its already big, with 4 more themes for each icon repository size would increase 5 times.

Good news is icons are open source, so I've made repository with latest icons. See https://github.com/cyberalien/google-material-design-icons-updated

That repository contains:

  • All latest icons from material.io in 5 themes
  • Icons that have bugs are fixed
  • Icons that exist in this repository, but are missing on material.io with custom variations to match all theme

In my repository font is not available yet, but together with jossef and Azumgi we are figuring out how to make it work.

Thanks @cyberalien for you work. Still sad that Google is not maintaining it and some of us have to do this on their own.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

cdeutsch picture cdeutsch  路  4Comments

Unknow-max picture Unknow-max  路  3Comments

quyleanh picture quyleanh  路  4Comments

phidias51 picture phidias51  路  4Comments

juristr picture juristr  路  4Comments