TDesign Icons Icons

Browse 2356 free TDesign Icons SVG icons. Download SVG, copy as JSX, PNG or Base64. MIT licensed. Designed by TDesign. Styles: Uses Stroke.

2,356 icons MIT UI 24px 24px grid by TDesign
Search icons...

More SVG Icons

ability-open

abstract

abstract-filled

accessibility

accessibility-filled

activity

activity-filled

add

add-and-subtract

add-circle

add-circle-filled

add-rectangle

add-rectangle-filled

address-book

address-book-filled

adjustment

adjustment-filled

ai

ai-1

ai-1-filled

ai-article

ai-article-filled

ai-book-open

ai-book-open-filled

ai-chart-bar

ai-chart-bar-filled

ai-coordinate-system

ai-coordinate-system-filled

ai-cut

ai-edit

ai-edit-1

ai-edit-1-filled

ai-edit-filled

ai-education

ai-education-filled

ai-git-branch

ai-git-branch-filled

ai-image

ai-image-1

ai-image-1-filled

ai-image-filled

ai-layout

ai-layout-filled

ai-music

ai-music-filled

ai-screenshot

ai-search

ai-search-filled

ai-terminal

ai-terminal-1

ai-terminal-1-filled

ai-terminal-filled

ai-textformat-italic

ai-tool

ai-tool-filled

ai-video

ai-video-filled

airplay-wave

airplay-wave-filled

alarm

alarm-add

alarm-add-filled

alarm-filled

alarm-off

alarm-off-filled

align-bottom

align-top

align-vertical

alpha

analytics

analytics-filled

anchor

Copy & download TDesign Icons icons

Click any icon above to open the detail panel. Four export formats are available instantly, no sign-up required.

SVG

Raw vector markup. Paste directly into HTML or React components. Scales to any size without quality loss.

JSX / TSX

React-ready component. Drop into any React or Next.js project. Works with shadcn/ui, Radix, and Tailwind CSS.

PNG

Raster export at 1×, 2× and 3× for email templates, Figma imports, app assets, and Open Graph images.

Base64

Inline data URI, embed icons in CSS background-image, email HTML, or anywhere an image URL is needed.

Works with shadcn/ui

Copy the JSX format and paste directly into any shadcn/ui component. Alternatively, install and use via @iconify/react, fully tree-shakeable, no icon font loading required.

About TDesign Icons

Created By

TDesign Visit Website

License

MIT View License

Features & Tags

Uses Stroke

Pack Details

Color Support

Monochrome

Category

UI 24px

How to use TDesign Icons icons

License SPDX

MIT

Grid Size

24px

Sample Icons

activity, doge, dam

Via Iconify · React

tsx 
import { Icon } from '@iconify/react';

export default function App() {
  return <Icon icon="tdesign:icon-name" width={24} />;
}

Via Iconify · HTML

html 
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="tdesign:icon-name" width="24"></iconify-icon>

Frequently Asked Questions

Is TDesign Icons free for commercial use?
Yes. TDesign Icons is licensed under MIT, free for personal and commercial projects. View license →
How do I download TDesign Icons SVG icons?
Click any icon in the browser above to open the detail panel. Choose raw SVG code to copy, download as SVG or PNG, export as a React JSX component, or get a Base64 data URI, all formats free, no sign-up required.
How many icons are in TDesign Icons?
TDesign Icons contains 2,356 SVG icons in the UI 24px category, designed on a 24px grid.
Can I change the color of TDesign Icons icons?
Yes. TDesign Icons icons are monochrome SVGs that inherit CSS currentColor. Set a color via CSS (color: #0070f3), a Tailwind class (text-blue-500), or pass a fill / stroke attribute directly on the SVG.
Can I use TDesign Icons with React, Next.js or shadcn/ui?
Yes. Copy the JSX export from any icon's detail panel and paste it directly into your component. For ongoing use, install @iconify-json/tdesign and use it via @iconify/react, fully tree-shakeable, compatible with shadcn/ui, Tailwind CSS, Radix UI, and any React-based framework.