React Native IconPark

English | 简体中文

---

English

Transform IconPark SVG icons into React Native components using react-native-svg.

Original Project: IconPark · GitHub

Installation

npm install react-native-iconpark react-native-svg

Usage

import { Home, Camera, User } from 'react-native-iconpark';

// Basic
<Home size={24} />

// Outline theme (default)
<Camera theme="outline" size={32} fill="#000" />

// Filled theme
<User theme="filled" size={32} fill="#333" />

// Two-tone theme
<Camera theme="two-tone" size={32} fill={['#333', '#2F88FF']} />

// Multi-color theme
<Camera theme="multi-color" size={32} fill={['#333', '#2F88FF', '#FFF', '#43CCF8']} />

Props

Prop	Type	Default
size	number | string	24
fill	string | string[]	'#333'
theme	'outline' | 'filled' | 'two-tone' | 'multi-color'	'outline'
strokeWidth	number	4
strokeLinecap	'butt' | 'round' | 'square'	'round'
strokeLinejoin	'miter' | 'round' | 'bevel'	'round'
style	ViewStyle	-

For more details, please refer to IconPark Official Documentation.

License

Apache-2.0

---

简体中文

使用 react-native-svg 将 IconPark SVG 图标包装为 React Native 组件。

原项目： IconPark · GitHub

安装

npm install react-native-iconpark react-native-svg

使用

import { Home, Camera, User } from 'react-native-iconpark';

// 基础用法
<Home size={24} />

// 线性主题（默认）
<Camera theme="outline" size={32} fill="#000" />

// 填充主题
<User theme="filled" size={32} fill="#333" />

// 双色主题
<Camera theme="two-tone" size={32} fill={['#333', '#2F88FF']} />

// 多色主题
<Camera theme="multi-color" size={32} fill={['#333', '#2F88FF', '#FFF', '#43CCF8']} />

属性

属性	类型	默认值
size	number | string	24
fill	string | string[]	'#333'
theme	'outline' | 'filled' | 'two-tone' | 'multi-color'	'outline'
strokeWidth	number	4
strokeLinecap	'butt' | 'round' | 'square'	'round'
strokeLinejoin	'miter' | 'round' | 'bevel'	'round'
style	ViewStyle	-

更多详情请参考 IconPark 官方文档。

许可证

Apache-2.0