@christicons/react

React components for the Christicons icon set.

Installation

npm install @christicons/react

Dynamic icon by name

import { Christicon } from '@christicons/react'

export function Example() {
  return <Christicon name="cross" size={24} color="#111827" title="Cross" />
}

Named icon imports

import { CrossIcon, HeartIcon } from '@christicons/react'

export function Example() {
  return (
    <div style={{ display: 'flex', gap: 12 }}>
      <CrossIcon size={24} />
      <HeartIcon size="2rem" color="#dc2626" title="Heart" />
    </div>
  )
}

Available props

• size?: number | string
• color?: string
• title?: string
• Any standard span HTML attributes such as className, style, aria-*, or data-*

Metadata and icon list

import { iconNames, iconMetadata, reactIconsByName } from '@christicons/react'

const firstIconName = iconNames[0]
const FirstIcon = reactIconsByName[firstIconName]
const firstMeta = iconMetadata[firstIconName]

Package contents

• Framework-ready React components
• Dynamic icon rendering by name
• Re-exported icon metadata from @christicons/core