logo

Icon

Semantic vector graphics. Before use icons。

List of icons

Examples

Set icon name with Type property, set theme with Theme property. You can also specify the Spin property to show spinning animation.

expand code expand code

Create a reusable React component by using <Icon component={...} />. The property component takes a React component that renders to svg element.

expand code expand code

You can use <script> multiple times, manage icons in one <Icon /> from multiple iconfont.cn resources. If icon with a duplicate name in resources, it will overrided in array order.

expand code expand code

You can set twoToneColor prop to specific primary color for two-tone icons.

expand code expand code

If you are using iconfont.cn, you can use <script> to import JS of 'Quote as Symbol' so that the icons in your project gracefully.

JS to get: Create project -> Import icon -> Select 'Symbol' -> View online links

expand code expand code

Icon API#

Property Description Type Default Value
Alt ParameterAlternative text for the icon String --
Role ParameterRotate icon with animation String img
AriaLabel ParameterSets the value of the aria-label attribute String --
Spin ParameterRotate icon with animation Boolean false
Rotate ParameterRotate by n degrees - does not work in IE9 Int32 0
Type ParameterIcon name to show String --
Theme ParameterWhich theme of icon - 'fill' | 'outline' | 'twotone'; String IconThemeType.Outline
TwotoneColor ParameterSpecify the primary color when using the TwoTone theme. Other themes ignore this parameter. String --
IconFont ParameterThe type of IconFont String --
Width ParameterWidth of the icon String 1em
Height ParameterHeight of the icon String 1em
Fill ParameterFill value for the icon's SVG String currentColor
TabIndex ParameterTabindex for the wrapping span String --
StopPropagation ParameterStop propagation of the click event on the icon Boolean false
OnClick ParameterOnClick event for the icon EventCallback<MouseEventArgs> --
Component ParameterThe component to render as a custom icon RenderFragment --
Id ParameterID for the component's HTML String Uniquely Generated ID
Class ParameterSpecifies one or more class names for an DOM element. String --
Style ParameterSpecifies an inline style for a DOM element. String --
RefBack ParameterA ForwardRef instance. You can get a reference to the internal DOM by using AntDesign.ForwardRef.Current. ForwardRef --
Button Typography
文档已更新,请点击 此处 更新。
A new version of this app is available. Click here to update.