あなたの次のWebアプリのための偉大なSVGリソース


私は自分自身が反応アプリに取り組んで、他の日にいくつかのスタイルと関心の画像を追加する必要が見つかりました.私はデザイナーではないので、私はウェブアプリの外観を作ることで得ることができる任意の助けを大いに感謝です.私は、WebアプリはSVG画像を使用する応答する必要がありますので、決定した.SVG (or Scaleable Vector Graphics) 2 D画像のためのXMLベースのベクトル画像形式です.
反応アプリでそれらを使用すると、かなり簡単です
import React, { Component } from "react";
import example from '../assets/img/example.svg';
import './example.css';

class Example extends Component {
    render() {
      return (
        <div>
          <div className="img-part" >
            <img src={example} alt="example" />
          </div>
        </div>
      );
    }
  }

  export default Example;
SVGイメージを使用する利点は以下の通りです.
  • ユーザーは、アプリケーションを変更すると、完全に再スケールします.
  • SVGはXMLベースであるので、あなたのイメージのために非常により小さいファイルサイズを意味することができるロスレスデータ圧縮アルゴリズムの良い候補です.
  • SVGはXMLベースであるので、画像ファイルは直接編集可能であり、また、Inkscape .
  • 私の検索では、私はunDraw . Undrawはオープンソースコミュニティに貢献したいデザイナーからのSVGイメージのセットです.私は、美しさ、スタイルとSVGイメージの巨大な選択に非常に感動しました.イメージの1つの例は、このブログ柱の表紙写真です.
    SVGイメージのこのセットに関するユニークなものの1つは、あなたがここで見られるようにイメージの色を調節することができるということです:
    Undrawまた、それは簡単にあなたのアプリケーションの主題に合う画像を見つけることができます非常に良いキーワード検索ツールが含まれています:
    The license for unDraw TLDRとして非常に許容されますis

    you can use the illustrations in any project, commercial or personal without attribution or any costs. Just don’t try to replicate unDraw, redistribute in packs the illustrations or create integrations for it.