react-fake-code

A React component that generates random (or predefined), customizable, colorful skeleton code purposed for beautiful tech landing pages.

An open source project by DevLuiz

Examples

Default behavior

import { FakeCode } from "react-fake-code";

function MyComponent() {
	return <FakeCode />;
}

Custom props

import { FakeCode } from "react-fake-code";

function MyComponent() {
  return (
    <FakeCode
        colors={[
          "#119DA4", 
          "#0C7489", 
          "#13505B"
        ]}
        animationTime={6}
        maxIndent={5}
        minLines={10}
        maxLines={12}
        minWordWidth={30}
        maxWordWidth={60}
        wordStyle={{
          height: 24,
          borderRadius: "99px 0",
          margin: 6
        }}
        tabWidth={40}
    />
  );
}