npmpackage.info

Gathering detailed insights and metrics for react-fakeimg

react-fakeimg - 2.0.2 | npmpackage.info

react-fakeimg

React component to create fake image from Canvas

2.0.2

MIT

JavaScript

11.91 kB

3.5

Installations

npm install react-fakeimg

Developer Guide

BETA

Typescript

Yes

Module System

CommonJS

Node Version

20.9.0

NPM Version

10.1.0 Pull Requests

Open

7

Total

10

Closed

3

Issues

Open

0

Total

0

Closed

0

Releases

Unable to fetch releases

Languages

JavaScript

TypeScript

JavaScript (54.95%)

TypeScript (45.05%)

Developer

HuuDuc

Download Statistics

Total Downloads

Last Day

Last Week

Last Month

Last Year

GitHub Statistics

MIT License

2 Stars

13 Commits

1 Forks

2 Watchers

10 Branches

1 Contributors

Updated on Apr 23, 2025

Maintainers

View All 1 Contributors

Package Meta Information

Latest Version

2.0.2

Package Id

react-fakeimg@2.0.2

Unpacked Size

11.91 kB

Size

4.05 kB

File Count

NPM Version

10.1.0

Node Version

20.9.0

Published on

Nov 09, 2023

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

NaN

Compared to previous day

Last Week

NaN

Compared to previous week

Last Month

NaN

Compared to previous month

Last Year

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Peer Dependencies

react react-dom

Dev Dependencies

@types/react typescript

React Fakeimg

Need fake image for your mockup ? react-fakeimg will create for you a fake image thanks to canvas. There is no HTTP Requests which means internet connection is not required.

Install in your project

via npm

1npm install --save react-fakeimg

via yarn

1yarn add react-fakeimg

How to use

Import ES6

1import FakeImg from 'react-fakeimg';

Simple example

1<FakeImg
2  alt="example"
3  width={500}
4  height={200}
5/>

Text example

1<FakeImg
2  alt="example"
3  width={500}
4  height={200}
5  text="Bonjour!"
6/>

Change color example

1<FakeImg
2  alt="example"
3  width={500}
4  height={200}
5  text="New color"
6  bgColor="#005cc5"
7  fontColor="#ffffff"
8/>

API

Attributes list

Properties	type	Required	default	Description
alt	string			alt attribute is require in HTML5 for img tag
bgColor	string		#c19d67	Background colors
className	string			Add class attribute
fontColor	string		#3a2306	Font color
height	Number	✓		Image height
id	string			#id
text	string			text to replace "width x height"
style	object			If you want to add style to the image
width	Number	✓		Image width

Events list

Name	type	Parameters	Description
onMount	func	none	Called when the component did mount
onClick	func	none	Called when click on the component
onMouseEnter	func	none	Called when mouse enter the component
onMouseLeave	func	none	Called when mouse leave the component
onUnMount	func	none	Called when the component will unMount

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

License

Determines if the project has defined a license.

10

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

0

SAST

Determines if the project uses static code analysis.

0

Maintained

Determines if the project is "actively maintained".

0

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

Score

3.5

/10

Last Scanned on 2025-07-14

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More