jxnblk / Rmdi
Licence: mit
React Material Design Icons – built with Pixo, Styled Components, and Styled System
Stars: ✭ 132
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Rmdi
Icons
Material Design inspired product icons
Stars: ✭ 110 (-16.67%)
Mutual labels: svg, material-design, icons
React Kawaii
Cute SVG React Components
Stars: ✭ 2,709 (+1952.27%)
Mutual labels: svg, components, icons
Pixo
Convert SVG icons into React components
Stars: ✭ 371 (+181.06%)
Mutual labels: svg, components, icons
Materialdesign Svg
@mdi/svg Dist for Material Design Icons.
Stars: ✭ 166 (+25.76%)
Mutual labels: svg, material-design, icons
Materialdesign
✒6200+ Material Design Icons from the Community
Stars: ✭ 9,669 (+7225%)
Mutual labels: svg, material-design, icons
Svg To Ts
Build performant SVG icon libraries by converting raw SVG files to TypeScript that is optimized for modern tree shaking mechanisms.
Stars: ✭ 131 (-0.76%)
Mutual labels: svg, icons
Svg Icon
👻 A lightweight library that makes it easier to use SVG icons in your Angular Application
Stars: ✭ 112 (-15.15%)
Mutual labels: svg, icons
Tabler Icons
A set of over 1400 free MIT-licensed high-quality SVG icons for you to use in your web projects.
Stars: ✭ 10,858 (+8125.76%)
Mutual labels: svg, icons
Icons
The premium icon font for @uiwjs Component Library. https://uiwjs.github.io/icons
Stars: ✭ 99 (-25%)
Mutual labels: svg, icons
Material Design Icons
Material Design icons by Google
Stars: ✭ 44,551 (+33650.76%)
Mutual labels: material-design, icons
Vectoriconsroundup
A comparison between popular vectorial icon fonts
Stars: ✭ 126 (-4.55%)
Mutual labels: material-design, icons
Android Icon Pack
Material Open Source's Android Icon Pack Running on Adian Follestad's Polar Dashboard
Stars: ✭ 130 (-1.52%)
Mutual labels: material-design, icons
Svgiconimagelist
Three engines to render SVG (GDI+, Direct2D or Cairo) and four components to simplify use of SVG images (resize, fixedcolor, grayscale...): TSVGIconImage, TSVGIconImageCollection, TSVGIconVirtualImageList and TSVGIconImageList (for VCL and FMX).
Stars: ✭ 127 (-3.79%)
Mutual labels: svg, icons
React Material Design Icons
Built with Pixo, Styled Components, and Styled System
npm i rmdi
// import icons individually for better tree-shaking
import Accessibility from 'rmdi/lib/Accessibility'
const App = props => (
<Accessibility
size={32}
color='tomato'
/>
)
// import all icons as a single component
import { Icon } from 'rmdi'
const App = props => (
<Icon
name='accessibility'
size={32}
color='tomato'
/>
)
List of Icons
See the icon list for a complete list of all icons available
Props
| Prop | Type | Description |
|---|---|---|
size |
number | width and height in pixels |
color |
string | fill color, uses Styled System's color function |
Spacing Props
Margin can be applied with the following props, which use Styled System's space function.
Margin props accept numbers for pixel values, strings with CSS units, or arrays for responsive margin
| Prop | Description |
|---|---|
m |
margin |
mt |
margin-top |
mr |
margin-right |
mb |
margin-bottom |
ml |
margin-left |
mx |
margin-left and margin-right |
my |
margin-top and margin-bottom |
Contributing
npm install
The build process will:
- Parse the
material-design-iconspackage for SVG source code - Copy the icons to the
svg/folder - Create an
examples/folder for tests and development - Run Pixo on the
svg/folder and output tosrc/ - Run Babel on the
src/folder and output tolib/
Tests:
npm test
To run the development server:
npm start
Related
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].