# Installation

> Add Honest UI icons, logos, and vectors to your React project.

Source: https://www.honestui.com/docs/icons/installation

Icons, logos, and vectors are distributed with `honestui`. They require no stylesheet or provider.

## Steps [#steps]


  
    ### 
      Install the package
    

    
      
        Install `honestui` once from your project root. All three collections are included.
      

      <CommandBlock commands="[&#x22;honestui&#x22;]" />
    
  

  
    ### 
      Choose a collection
    

    
      
        Use Icons for interface symbols, Logos for identities, or Vectors for decorative artwork. Select a collection and category from the sidebar to browse its assets.
      
    
  

  
    ### 
      Import from its entry point
    

    
      
        Each collection has a dedicated entry point so named imports remain clear and tree-shakeable.
      

      ```tsx
      import { Search } from "honestui/icons";
      import { Vercel } from "honestui/logos";
      import { Abstract1Shapes } from "honestui/vectors";

      export function AssetRow() {
        return (
          <div className="flex items-center gap-4">
            <Search size={20} aria-hidden="true" />
            <Vercel size={24} aria-label="Vercel" />
            <Abstract1Shapes className="size-12" aria-hidden="true" />
          </div>
        );
      }
      ```
    
  


## Entry points [#entry-points]

* `honestui/icons` exports interface icons, icon metadata, and `allIcons`.
* `honestui/logos` exports logos and wordmarks, logo metadata, and `allLogos`.
* `honestui/vectors` exports decorative vectors, vector metadata, and `allVectors`.

Import directly from an entry point rather than the package root. No CSS import, asset loader, SVG configuration, or runtime initialization is needed.

## React requirements [#react-requirements]

The assets are React SVG components and use the React JSX runtime. Your application must provide the compatible `react` and `react-dom` peer dependencies listed by `honestui`.