Skip to content

Latest commit

 

History

History
62 lines (51 loc) · 2.66 KB

README.md

File metadata and controls

62 lines (51 loc) · 2.66 KB

react-initial

React Initial

Simple react component to make Gmail like text avatars for profile pictures.

npm version License npm

Usage

import React, { Component } from 'react'
import { Initial } from 'react-initial'

export default class MyComponent extends Component {
  render () {
    return (
      <Initial
        name='Bruno Carvalho de Araujo'
      />
    )
  }
}

Props

The Initial component takes a couple of props that you can use to customize its behaviour:

Name Type Description Default
name string Name of the user which the profile picture should be generated Name
height number Height of the picture 100
width number Width of the picture 100
charCount number Number of characherts to be shown in the picture. 1
textColor string Color of the text #ffffff
fontSize number Font size of the character(s) 60
fontWeight number Font weight of the character(s) 400
radius number Rounded corners 0
seed number Number to randomize the background color 0
color string Background color of the profile picture that should be generated null
useWords boolean number of characters while splitting the words over spaces null

Compatibility

  • Chrome
  • Firefox
  • Opera 9+
  • Safari 3.2+
  • iOS Safari 3.2+
  • Android Browser 3+

References to create project