在React中创建像素艺术脸谱的实例教程

一个React组件，用于创建随机或自定义的像素面卡。

如何使用它

1.安装和导入。

# Yarn
$ yarn add react-pixelart-face-card

# NPM
$ npm i react-pixelart-face-card

import { PixelArtCard } from 'react-pixelart-face-card'

2.创建一个随机的像素脸卡。

<PixelArtCard random={true} size={150} tags={['human-female','human-male']}/>

3.创建一个自定义的像素脸，可自定义头发、眼睛、鼻子、胡须、嘴巴、饰品等。

<PixelArtCard color={'#efd0c9'}  size={150} tags={[ 'human-male']} hover={true} hoverColor={'red'}>
  <PixelArtCard.Hair color='brown' />
  <PixelArtCard.HeadAccessory  />
  <PixelArtCard.Eyes />
  <PixelArtCard.EyesAccessory/>
  <PixelArtCard.EarAccessory/>
  <PixelArtCard.Nose />
  <PixelArtCard.Beard />
  <PixelArtCard.Mouth/>
  <PixelArtCard.MouthAccessory />
  <PixelArtCard.NeckAccessory value='neck-accessory-3'  color='blue'/>
</PixelArtCard>

4.创建一个具有自定义值的自定义像素脸。

<PixelArtCard color={'#efd0c9'}  size={150} tags={[ 'human-male']} hover={true} hoverColor={'red'}>
  <PixelArtCard.Hair color='black' />
</PixelArtCard>

预览

The postCreate Pixel Art Faces In Reactappeared first onReactScript.