Click here to Skip to main content
14,692,225 members
Articles » Web Development » Client side scripting » Controls
Article
Posted 20 Nov 2020

Stats

2.7K views
6 bookmarked

React Icon Set for CRUD Applications

Rate me:
Please Sign up or sign in to vote.
5.00/5 (3 votes)
20 Nov 2020MIT
SVG icon set for CRUD applications packaged as a React component with light & dark themes and tooltip.
In this article, you will see SVG icon set for CRUD applications. It is packaged as a React component with light and dark themes and a tooltip.

Set of 48 Icons

A set of SVG icons for CRUD applications (hand-picked among thousands at Material Design Icons) packaged as a React component with light & dark themes and tooltip.

Image 1

Themes & Sizes

React-CRUD-Icons comes in Light and Dark theme.

Image 2

... and 6 sizes: Tiny, Small, Medium, Large, Big, and Huge.

Image 3

Installation

The package can be installed via npm:

npm install react-crud-icons --save

You will need to install React and PropTypes separately since those dependencies aren't included in the package.

Using the Code

Below is a simple example of how to use the component in a React view. You will also need to include the CSS file from this package (or provide your own). The example below shows how to include the CSS from this package if your build system supports requiring CSS files (Webpack is one that does).

import React from "react";
import Icon from "react-crud-icons";

import "../node_modules/react-crud-icons/dist/react-crud-icons.css";

class Example extends React.Component {
  render() {
    return (
      <Icon
        name = "edit"
        tooltip = "Edit"
        theme = "light"
        size = "medium"
        onClick = { doSomething }
      />
    );
  }
}

Points of Interest

To package the code, I followed the steps from the blog post Building a React component as an NPM module by Manoj Singh Negi.

History

  • 20th November, 2020: Initial version

License

This article, along with any associated source code and files, is licensed under The MIT License

Share

About the Author

Evoluteur
United States United States
I'm a UI engineer with an eye for UX and a passion for model-driven UIs.

I usually build UIs for startups in the San Francisco Bay Area.

My hobby open source project is Evolutility, a minimalist low-code platform with a model-driven UI, a model-driven backend, and a set of models to play with.

More about me on my GitHub page.

Comments and Discussions

 
-- There are no messages in this forum --