Phosphor · 开源项目

Phosphor 图标

Phosphor 是一个灵活的图标家族，适用于界面、图表、演示文稿——实际上，任何场景都可以。

1,248 个图标，持续增长中
6 种粗细：细体、轻体、常规体、粗体、填充体和双色调
设计为 16x16 像素，在小尺寸下易读，放大后仍清晰
保留原始描边信息，便于微调风格

更多使用方式请访问 phosphoricons.com。

面向开发者

Phosphor 适用于 Web、React、Vue、Flutter、Elm以及其他框架和平台。

React

功能强大——Phosphor 直观而强大的 API 可以通过几个按键设置图标的 color、size 和 weight，通过 Context API 为所有图标提供默认样式，或者通过渲染属性在运行时直接操作 SVG 实现一些惊人的效果！查看 @phosphor-icons/react 仓库页面上的完整文档。

jsx

import React from "react";
import ReactDOM from "react-dom";
import { Smiley, Heart, Horse } from "@phosphor-icons/react";

const App = () => {
  return (
    <div>
      <Smiley />
      <Heart size={32} color="hotpink" weight="fill" />
      <Horse weight="duotone" />
    </div>
  );
};

ReactDOM.render(<App />, document.getElementById("root"));

Phosphor 图标

面向开发者

分享