Foundations

Iconography

Color scheme
Brand
Density
Radius
Emphasis
Type scale

Section 01

Icon Search

Bộ icon Casso v0.2.0 có 1826 icon 24×24 đơn sắc. Mỗi ô cho chép tên, chép mã SVG để dán vào code hoặc tải file .svg. Nút trên thanh tải cả nhóm đang lọc thành file .zip, chia sẵn thư mục theo category, gồm cả những icon chưa hiện dưới lưới.

Search by Name

1826 icon, đang hiện 240 đầu

icon-activity-heart-line

icon-activity-heart-solid

icon-activity-line

icon-adjust-line

icon-adjust-solid

icon-airplay-line

icon-airplay-solid

icon-airpods-line

icon-airpods-solid

icon-alarm-clock-check-line

icon-alarm-clock-check-solid

icon-alarm-clock-line

icon-alarm-clock-minus-line

icon-alarm-clock-minus-solid

icon-alarm-clock-off-line

icon-alarm-clock-off-solid

icon-alarm-clock-plus-line

icon-alarm-clock-plus-solid

icon-alarm-clock-solid

icon-alert-circle-line

icon-alert-circle-solid

icon-alert-hexagon-line

icon-alert-hexagon-solid

icon-alert-octagon-line

icon-alert-octagon-solid

icon-alert-square-line

icon-alert-square-solid

icon-alert-triangle-line

icon-alert-triangle-solid

icon-align-bottom-01-line

icon-align-bottom-01-solid

icon-align-bottom-02-line

icon-align-bottom-02-solid

icon-align-center-line

icon-align-center-solid

icon-align-horizontal-centre-01-line

icon-align-horizontal-centre-01-solid

icon-align-horizontal-centre-02-line

icon-align-horizontal-centre-02-solid

icon-align-justify-line

icon-align-justify-solid

icon-align-left-01-line

icon-align-left-01-solid

icon-align-left-02-line

icon-align-left-02-solid

icon-align-left-line

icon-align-left-solid

icon-align-right-01-line

icon-align-right-01-solid

icon-align-right-02-line

icon-align-right-02-solid

icon-align-right-line

icon-align-right-solid

icon-align-top-01-line

icon-align-top-01-solid

icon-align-top-02-line

icon-align-top-02-solid

icon-align-vertical-center-01-line

icon-align-vertical-center-01-solid

icon-align-vertical-center-02-line

icon-align-vertical-center-02-solid

icon-anchor-line

icon-anchor-solid

icon-annotation-alert-line

icon-annotation-alert-solid

icon-annotation-check-line

icon-annotation-check-solid

icon-annotation-dots-line

icon-annotation-dots-solid

icon-annotation-heart-line

icon-annotation-heart-solid

icon-annotation-info-line

icon-annotation-info-solid

icon-annotation-line

icon-annotation-plus-line

icon-annotation-plus-solid

icon-annotation-question-line

icon-annotation-question-solid

icon-annotation-solid

icon-annotation-x-line

icon-annotation-x-solid

icon-archive-line

icon-archive-solid

icon-arrow-block-down-line

icon-arrow-block-down-solid

icon-arrow-block-left-line

icon-arrow-block-left-solid

icon-arrow-block-right-line

icon-arrow-block-right-solid

icon-arrow-block-up-line

icon-arrow-block-up-solid

icon-arrow-circle-broken-down-left-line

icon-arrow-circle-broken-down-line

icon-arrow-circle-broken-down-right-line

icon-arrow-circle-broken-left-line

icon-arrow-circle-broken-right-line

icon-arrow-circle-broken-up-left-line

icon-arrow-circle-broken-up-line

icon-arrow-circle-broken-up-right-line

icon-arrow-circle-down-left-line

icon-arrow-circle-down-left-solid

icon-arrow-circle-down-line

icon-arrow-circle-down-right-line

icon-arrow-circle-down-right-solid

icon-arrow-circle-down-solid

icon-arrow-circle-left-line

icon-arrow-circle-left-solid

icon-arrow-circle-right-line

icon-arrow-circle-right-solid

icon-arrow-circle-up-left-line

icon-arrow-circle-up-left-solid

icon-arrow-circle-up-line

icon-arrow-circle-up-right-line

icon-arrow-circle-up-right-solid

icon-arrow-circle-up-solid

icon-arrow-down-left-line

icon-arrow-down-line

icon-arrow-down-right-line

icon-arrow-left-line

icon-arrow-narrow-down-left-line

icon-arrow-narrow-down-line

icon-arrow-narrow-down-right-line

icon-arrow-narrow-left-line

icon-arrow-narrow-right-line

icon-arrow-narrow-up-left-line

icon-arrow-narrow-up-line

icon-arrow-narrow-up-right-line

icon-arrow-right-line

icon-arrow-square-down-left-line

icon-arrow-square-down-left-solid

icon-arrow-square-down-line

icon-arrow-square-down-right-line

icon-arrow-square-down-right-solid

icon-arrow-square-down-solid

icon-arrow-square-left-line

icon-arrow-square-left-solid

icon-arrow-square-right-line

icon-arrow-square-right-solid

icon-arrow-square-up-left-line

icon-arrow-square-up-left-solid

icon-arrow-square-up-line

icon-arrow-square-up-right-line

icon-arrow-square-up-right-solid

icon-arrow-square-up-solid

icon-arrow-up-left-line

icon-arrow-up-line

icon-arrow-up-right-line

icon-arrows-down-line

icon-arrows-left-line

icon-arrows-right-line

icon-arrows-triangle-line

icon-arrows-up-line

icon-asterisk-line

icon-at-sign-line

icon-atom-01-line

icon-atom-01-solid

icon-atom-02-line

icon-atom-02-solid

icon-attachment-01-line

icon-attachment-01-solid

icon-attachment-02-line

icon-attachment-02-solid

icon-award-01-line

icon-award-01-solid

icon-award-02-line

icon-award-02-solid

icon-award-03-line

icon-award-03-solid

icon-award-04-line

icon-award-04-solid

icon-award-05-line

icon-award-05-solid

icon-backpack-line

icon-backpack-solid

icon-bank-line

icon-bank-note-01-line

icon-bank-note-01-solid

icon-bank-note-02-line

icon-bank-note-02-solid

icon-bank-note-03-line

icon-bank-note-03-solid

icon-bank-solid

icon-bar-chart-01-line

icon-bar-chart-02-line

icon-bar-chart-03-line

icon-bar-chart-04-line

icon-bar-chart-05-line

icon-bar-chart-05-solid

icon-bar-chart-06-line

icon-bar-chart-06-solid

icon-bar-chart-07-line

icon-bar-chart-07-solid

icon-bar-chart-square-01-line

icon-bar-chart-square-01-solid

icon-bar-chart-square-02-line

icon-bar-chart-square-02-solid

icon-bar-chart-square-03-line

icon-bar-chart-square-03-solid

icon-bar-chart-up-line

icon-battery-charging-01-line

icon-battery-charging-01-solid

icon-battery-charging-02-line

icon-battery-charging-02-solid

icon-battery-empty-line

icon-battery-empty-solid

icon-battery-full-line

icon-battery-full-solid

icon-battery-low-line

icon-battery-low-solid

icon-battery-mid-line

icon-battery-mid-solid

icon-beaker-01-line

icon-beaker-01-solid

icon-beaker-02-line

icon-beaker-02-solid

icon-bell-01-line

icon-bell-01-solid

icon-bell-02-line

icon-bell-02-solid

icon-bell-off-line

icon-bell-off-solid

icon-bezier-curve-01-line

icon-bezier-curve-01-solid

icon-bezier-curve-02-line

icon-bezier-curve-02-solid

icon-bezier-curve-03-line

icon-bezier-curve-03-solid

icon-bluetooth-connect-line

icon-bluetooth-connect-solid

icon-bluetooth-off-line

icon-bluetooth-off-solid

icon-bluetooth-on-line

icon-bluetooth-on-solid

icon-bluetooth-signal-line

icon-bluetooth-signal-solid

icon-bold-01-line

icon-bold-01-solid

icon-bold-02-line

icon-bold-02-solid

icon-bold-square-line

File tải về trùng từng byte với file gốc, không phải bản vẽ lại. Icon không có màu riêng: fill là currentColor, nên icon lấy màu chữ của thẻ cha và hiện đúng ở cả Light lẫn Dark mode.

Section 02

Icon Aliases

Button, Chip, Checkbox, Radio và Input gọi icon bằng alias trong DOM. Bảng dưới quy đổi alias sang tên icon thật trong bộ icon.

Alias → Icon Name

checkicon-check-line

minusicon-minus-line

doticon-circle-solid

closeicon-x-circle-solid

infoicon-info-circle-solid

alerticon-alert-hexagon-solid

plusicon-plus-line

careticon-chevron-down-line

searchicon-search-medium-line

staricon-star-01-solid

Code sản phẩm dùng tên icon thật, không dùng alias, vì alias chỉ có trong trang này.

Iconography

Icon Search

Search by Name

Categories

Icons per Category

Icon Aliases

Alias → Icon Name