Coreuiアイコンは、複数形式のSVG、PNG、およびWebFontsの1500を超えるアイコンを備えたオープンソースアイコンセットです。 Coreuiアイコンは、一般的なアクションとアイテムのための美しく作成されたシンボルです。 Webまたはモバイルアプリのデジタル製品でそれらを使用できます。
https://coreui.io/icons/
< link rel =" stylesheet " href =" https://unpkg.com/@coreui/icons/css/all.min.css " >
または
< link rel =" stylesheet " href =" https://unpkg.com/@coreui/icons/css/free.min.css " >
< link rel =" stylesheet " href =" https://unpkg.com/@coreui/icons/css/brand.min.css " >
< link rel =" stylesheet " href =" https://unpkg.com/@coreui/icons/css/flag.min.css " >
npm install @coreui/icons --save
yarn add @coreui/icons
または、このリポジトリをzipとしてクローンまたはダウンロードすることもできます。
CSSスタイルのプレフィックスとアイコンの名前を使用して、Coreuiアイコンをほぼどこにでも配置できます。 Coreuiアイコンは、インライン要素Exで使用するように設計されています。 <i>
または<span>
。
線形アイコンにはcil-
プレフィックス、ブランドアイコンのcib-
プレフィックス、フラグアイコンにcif-
プレフィックスを使用してください。
< i class =" cil-energy " > </ i >
< i class =" cib-twitter " > </ i >
< i class =" cif-us " > </ i >
SVGスプライトでは、ウェブサイトでベクトルアイコンをすばやく使用できます。すべてのアイコンセットスタイルを独自のSVGスプライトに準備しました。
プロジェクトに、画像やスタイルなどの静的ファイルの残りの部分を備えたスプライトファイルを配置します。 SVG Spriteファイルに適切なパスを追加し、表示するSVGアイコンまたはシンボルに固有のフラグメント識別子を使用してください。
< svg >
< use xlink:href =" path/to/free.svg#cil-airplane-mode " > </ use >
</ svg >
< svg >
< use xlink:href =" path/to/brand.svg#cib-twitter " > </ use >
</ svg >
< svg >
< use xlink:href =" path/to/flag.svg#cif-us " > </ use >
</ svg >
アイコンセットをダウンロードすると、SVGアイコンの定義を含むSpritesディレクトリが付属しています。これらのアイコンは参照でき、次のようなインラインSVGとして使用できます。
<!-- Define the symbols -->
< symbol id =" cil-apple " viewBox =" 0 0 24 24 " >
< title > apple </ title >
< path d =" M21.207 9.987c-0.497-1.275-1.29-2.262-2.293-2.863-0.25 0.477-0.524 0.888-0.835 1.267l0.010-0.013c0.002 0.001 0.004 0.002 0.005 0.003 1.494 0.859 2.364 3.054 2.114 5.338-0.414 3.784-1.563 6.377-3.236 7.302-1.087 0.601-2.444 0.516-4.031-0.254l-0.155-0.075h-1.143l-0.155 0.075c-1.588 0.77-2.944 0.856-4.031 0.254-1.673-0.925-2.822-3.518-3.236-7.302-0.25-2.284 0.619-4.479 2.114-5.338 0.445-0.259 0.979-0.411 1.549-0.411 0.011 0 0.023 0 0.034 0l-0.002-0c1.132 0 2.436 0.53 3.853 1.578l0.051 0.037s2.043-0.248 2.852-0.616c2.439-1.107 2.976-2.867 3.072-3.106 0.262-0.632 0.414-1.366 0.414-2.135 0-0.813-0.17-1.587-0.476-2.287l0.014 0.037-0.191-0.477-0.513 0.005c-3.151 0.036-5.692 2.598-5.692 5.755 0 0.255 0.017 0.507 0.049 0.754l-0.003-0.029c-0.886-0.496-1.747-0.813-2.573-0.944-1.169-0.186-2.241-0.005-3.186 0.538-1.038 0.596-1.855 1.601-2.364 2.906-0.463 1.186-0.638 2.57-0.493 3.895 0.475 4.344 1.859 7.267 4.001 8.452 0.655 0.37 1.438 0.588 2.272 0.588 0.010 0 0.021-0 0.031-0h-0.002c0.918-0 1.904-0.244 2.952-0.73h0.461c1.987 0.923 3.754 0.971 5.253 0.142 2.142-1.185 3.526-4.107 4.001-8.452 0.145-1.325-0.030-2.709-0.493-3.895zM15.376 2.851c0.322-0.143 0.697-0.251 1.088-0.305l0.022-0.003c0.106 0.354 0.167 0.761 0.167 1.182 0 2.15-1.593 3.927-3.663 4.215l-0.022 0.003c-0.106-0.354-0.167-0.76-0.167-1.181 0-1.743 1.048-3.242 2.547-3.901l0.027-0.011z " > </ path >
</ symbol >
<!-- Use the defined symbols -->
< svg >
< use xlink:href =" #cil-apple " > </ use >
</ svg >
定義を含む外部SVGにリンクすることもできます。
< svg class =" icon-home " >
< use xlink:href =" path/to/free.svg#cil-apple " > </ use >
</ svg >
無料のアイコンセットが不十分な場合は、2000を超えるアイコンとより多くのスタイル(ソリッド、デュオトーン、リニア)を備えたCoreui Icons Proを購入できます。
Coreuiアイコンは無料で、オープンソース、GPLフレンドリーです。商業プロジェクト、オープンソースプロジェクト、または実際に必要なものに使用することができます。
すべてのブランドアイコンは、それぞれの所有者の商標です。これらの商標の使用は、Font Awesomeによる商標所有者の承認を示すものではありません。参照する会社、製品、またはサービスを代表することを除いて、いかなる目的でもブランドロゴを使用しないでください。
CC0 1.0ユニバーサルの目的声明
世界中のほとんどの管轄区域の法律は、作成者とその後の所有者(それぞれ、すべて、すべて、「所有者」)の著者および/またはデータベース(またはデータベース(またはその後の所有者)に排他的な著作権と関連する権利(以下で定義)を自動的に付与します。それぞれ、「仕事」)。
特定の所有者は、一般の人々が後の侵害の主張、修正、組み込みの主張を恐れることができる創造的、文化的、科学的作品(「commons」)のコモンズに貢献する目的で、それらの権利を仕事に永久に放棄したいと考えています。他の作品では、あらゆる形態で可能な限り自由に再利用および再分配し、商業目的に限定されないいかなる目的でも、あらゆる目的で再分配します。これらの所有者は、自由な文化の理想と創造的、文化的、科学的作品のさらなる生産を促進するために、または他者の使用と努力を通じて彼らの仕事に対する評判またはより大きな分布を獲得するために、コモンズに貢献するかもしれません。
これらおよび/または他の目的や動機のために、そして追加の考慮または補償を期待することなく、CC0を仕事に関連付ける人(「Affirmer」)を関連付けます。この仕事は、自発的に仕事にCC0を適用し、その著作権と関連する権利の知識と、それらの権利に対するCC0の意味と意図された法的効果について、その条件の下で作業を公に分配することを自発的に選択しています。
私。作品を複製、適応、配布、実行、表示、通信、および翻訳する権利。
ii。元の著者および/またはパフォーマーによって保持されている道徳的権利。
iii。作品に描かれている人のイメージまたは肖像に関連する宣伝とプライバシーの権利。
IV。以下のパラグラフ4(a)の制限を条件として、作業に関する不公平な競争から保護する権利。
v。作業中のデータの抽出、普及、使用、再利用の保護権。
vi。データベースの権利(欧州議会の指令96/9/ECおよび1996年3月11日のデータベースの法的保護に関する評議会、およびそのような指示の修正または後継バージョンを含むその全国的な実施に基づいて発生するものなど) ;そして
vii。適用される法律または条約、およびその全国的な実施に基づいて、世界中で同様の同様の、同等または対応する権利。
権利放棄。適用法に違反していないが、違反していない最大の範囲で、これは、これを明確に、完全に、完全に、無条件に、無条件に、無条件に無条件に放棄し、放棄し、放棄し、関連する権利と関連する請求と行動の原因を、既知または未知(既存および将来の請求と訴訟の原因を含む)、世界中のすべての地域での作業(i)、(ii)適用法または条約(将来の時間延長を含む)によって提供される最大期間について、(iii )現在または将来の媒体および任意の数のコピーについて、および(iv)は、コマーシャル、広告、または宣伝目的(「権利放棄」)を含む、いかなる目的でもありません。 Affirmerは、一般の人々の各メンバーの利益と、Affirmerの相続人および後継者の利益のために免除を行い、そのような免除は失効、撤回、キャンセル、終了、またはその他の法的または公平な行動の対象とならないことを完全に意図していますAffirmerの明示的な目的声明によって考えられているように、一般の人々による仕事の静かな楽しみを混乱させる。
パブリックライセンスフォールバック。何らかの理由で免除の一部が適用法の下で法的に無効または効果がないと判断された場合、免除は、Affirmerの明示的な目的声明を考慮して許可されている最大範囲で保存されます。さらに、権利放棄が断言される限り、ここでは、影響を受けた人に、ロイヤリティのない、譲渡不可能、非排他的で、排他的で、取り返しのつかない、無条件の無条件のライセンスを与えて、アパフマーの著作権および関連する権利を行使します(i)世界中のすべての領土、(ii)適用法または条約(将来の時間延長を含む)によって提供される最大期間(将来の時間延長を含む)、(iii)現在または将来の媒体および任意の数のコピーの(iii)、および(iv)あらゆる目的のために(iv)コマーシャル、広告、または宣伝目的(「ライセンス」)に限定されません。ライセンスは、CC0が作業に肯定することによって適用された日付時点で有効とみなされます。何らかの理由でライセンスの一部が適用法の下で法的に無効または効果がないと判断された場合、そのような部分的な無効性または非効率性は、ライセンスの残りの部分を無効にしないでください。仕事における彼または彼女の残りの著作権および関連する権利のいずれか、または(ii)どちらの場合も、Affirmerの明示的な目的声明に反して、関連する請求および作業の原因を主張します。
制限と免責事項。
a。 Affirmerが保有する商標または特許権は、この文書の免除、放棄、降伏、認可、またはその他の影響を受けません。
b。 Affirmerは作業をAS-ISで提供し、タイトル、商品性、特定の目的への適合性、非侵害、または不在を含む、特に明示的、黙示的、法定、またはその他の作業に関するいかなる種類の表明も保証もしません。潜在的またはその他の欠陥、正確性、または現在または不在のエラーの現在または不在、発見可能かどうかにかかわらず、すべてが適用法の下で許容される最大の程度。
c。 Affirmerは、仕事やその使用に適用される可能性のある他の人の権利をクリアする責任を負いません。さらに、Affirmerは、作業の使用に必要な必要な同意、許可、またはその他の権利を取得する責任を放棄します。
d。 Affirmerは、クリエイティブコモンズはこの文書の当事者ではなく、このCC0または作業の使用に関して義務や義務がないことを理解し、認めています。
詳細については、http://creativecommons.org/publicdomain/zero/1.0/を参照してください。