blob: 2cd79807e956eb1a39424ba290691a57aa368cda [file] [log] [blame]
<!DOCTYPE html>
<!-- Copyright 2013 The Flutter Authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file. -->
<html>
<head>
<title>Cupertino Icons 1.0.0 Gallery</title>
<link href="css/icons.css" rel="stylesheet" type="text/css" />
<style>
{
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
body {
background: #fff;
color: #333;
font: 14px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: 0;
}
header {
border-bottom: 1px solid #eee;
margin-bottom: 20px;
overflow: hidden;
padding: 20px 0;
height: 60px;
display: flex;
align-items: center;
}
header h1 {
font-size: 21px;
font-weight: 400;
flex: 1;
}
.search-bar {
position: relative;
}
.search-bar>i {
position: absolute;
left: 7px;
top: 4px;
font-size: 22px;
}
.search-bar>input {
width: 200px;
outline: none;
font: 14px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
border: 1px solid #ccc;
border-radius: 5px;
padding: 3px 5px 3px 30px;
}
.content .hidden {
display: none;
}
.center {
margin-left: auto;
margin-right: auto;
max-width: 80%;
}
.icons {
overflow: hidden;
}
.content .icon-cell .cupertino-icons {
cursor: pointer;
}
.content {
padding-bottom: 250px;
}
.icons .icon-cell {
float: left;
width: calc(100% / 7);
text-align: center;
height: 100px;
margin-top: 30px;
}
@media (max-width: 1200px) {
.icons .icon-cell {
width: calc(100% / 5);
}
}
@media (max-width: 900px) {
.icons .icon-cell {
width: calc(100% / 4);
}
}
.icons .icon-name,
.icons .icon-size {
display: block;
font-size: 13.5px;
color: #666;
margin-top: 10px;
padding: 0px 10px;
word-break: break-all;
}
@media (max-width: 1200px) {
.icons .icon-name {
font-size: 12px;
}
}
@media (max-width: 900px) {
.icons .icon-name {
font-size: 11px;
}
}
.cupertino-icons.size-14 {
font-size: 14px;
}
.cupertino-icons.size-20 {
font-size: 20px;
}
.cupertino-icons.size-24 {
font-size: 24px;
}
.cupertino-icons.size-28 {
font-size: 28px;
}
.cupertino-icons.size-32 {
font-size: 32px;
}
.cupertino-icons.size-56 {
font-size: 56px;
}
.cupertino-icons.size-112 {
font-size: 112px;
}
.icon-preview {
box-shadow: 0px -10px 20px rgba(0,0,0,0.3);
background: #fff;
position: fixed;
bottom: 0;
left: 50%;
margin-left: -480px;
z-index: 100;
width: 960px;
display: none;
}
@media (max-width: 960px) {
.icon-preview {
left: 0;
width: 100%;
margin-left: 0;
}
}
.icon-preview .icons {
font-size: 0;
padding-bottom: 10px;
}
.icon-preview .icon-cell {
float: none;
display: inline-block;
margin: 0;
vertical-align: bottom;
height: auto;
}
.icon-preview .icon-preview-name {
font-size: 18px;
padding: 10px;
border-bottom: 1px solid #eee;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div class="center">
<header>
<h1>Cupertino Icons 1.0.0 Gallery</h1>
<div class="search-bar">
<i class="cupertino-icons">search</i>
<input placeholder="Search..." />
</div>
</header>
<div class="content">
<div class="icons">
<div class="icon-cell">
<i class="cupertino-icons size-28">airplane</i>
<span class="icon-name">airplane</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">alarm</i>
<span class="icon-name">alarm</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">alarm_fill</i>
<span class="icon-name">alarm_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">alt</i>
<span class="icon-name">alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ant</i>
<span class="icon-name">ant</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ant_circle</i>
<span class="icon-name">ant_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ant_circle_fill</i>
<span class="icon-name">ant_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ant_fill</i>
<span class="icon-name">ant_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">antenna_radiowaves_left_right</i>
<span class="icon-name">antenna_radiowaves_left_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">app</i>
<span class="icon-name">app</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">app_badge</i>
<span class="icon-name">app_badge</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">app_badge_fill</i>
<span class="icon-name">app_badge_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">app_fill</i>
<span class="icon-name">app_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">archivebox</i>
<span class="icon-name">archivebox</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">archivebox_fill</i>
<span class="icon-name">archivebox_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_2_circlepath</i>
<span class="icon-name">arrow_2_circlepath</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_2_circlepath_circle</i>
<span class="icon-name">arrow_2_circlepath_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_2_circlepath_circle_fill</i>
<span class="icon-name">arrow_2_circlepath_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_2_squarepath</i>
<span class="icon-name">arrow_2_squarepath</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_3_trianglepath</i>
<span class="icon-name">arrow_3_trianglepath</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_branch</i>
<span class="icon-name">arrow_branch</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_clockwise</i>
<span class="icon-name">arrow_clockwise</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_clockwise_circle</i>
<span class="icon-name">arrow_clockwise_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_clockwise_circle_fill</i>
<span class="icon-name">arrow_clockwise_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_counterclockwise</i>
<span class="icon-name">arrow_counterclockwise</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_counterclockwise_circle</i>
<span class="icon-name">arrow_counterclockwise_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_counterclockwise_circle_fill</i>
<span class="icon-name">arrow_counterclockwise_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down</i>
<span class="icon-name">arrow_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_circle</i>
<span class="icon-name">arrow_down_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_circle_fill</i>
<span class="icon-name">arrow_down_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_doc</i>
<span class="icon-name">arrow_down_doc</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_doc_fill</i>
<span class="icon-name">arrow_down_doc_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_left</i>
<span class="icon-name">arrow_down_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_left_circle</i>
<span class="icon-name">arrow_down_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_left_circle_fill</i>
<span class="icon-name">arrow_down_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_left_square</i>
<span class="icon-name">arrow_down_left_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_left_square_fill</i>
<span class="icon-name">arrow_down_left_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_right</i>
<span class="icon-name">arrow_down_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_right_arrow_up_left</i>
<span class="icon-name">arrow_down_right_arrow_up_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_right_circle</i>
<span class="icon-name">arrow_down_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_right_circle_fill</i>
<span class="icon-name">arrow_down_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_right_square</i>
<span class="icon-name">arrow_down_right_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_right_square_fill</i>
<span class="icon-name">arrow_down_right_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_square</i>
<span class="icon-name">arrow_down_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_square_fill</i>
<span class="icon-name">arrow_down_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_to_line</i>
<span class="icon-name">arrow_down_to_line</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_down_to_line_alt</i>
<span class="icon-name">arrow_down_to_line_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left</i>
<span class="icon-name">arrow_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_circle</i>
<span class="icon-name">arrow_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_circle_fill</i>
<span class="icon-name">arrow_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_right</i>
<span class="icon-name">arrow_left_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_right_circle</i>
<span class="icon-name">arrow_left_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_right_circle_fill</i>
<span class="icon-name">arrow_left_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_right_square</i>
<span class="icon-name">arrow_left_right_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_right_square_fill</i>
<span class="icon-name">arrow_left_right_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_square</i>
<span class="icon-name">arrow_left_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_square_fill</i>
<span class="icon-name">arrow_left_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_to_line</i>
<span class="icon-name">arrow_left_to_line</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_left_to_line_alt</i>
<span class="icon-name">arrow_left_to_line_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_merge</i>
<span class="icon-name">arrow_merge</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right</i>
<span class="icon-name">arrow_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_arrow_left</i>
<span class="icon-name">arrow_right_arrow_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_arrow_left_circle</i>
<span class="icon-name">arrow_right_arrow_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_arrow_left_circle_fill</i>
<span class="icon-name">arrow_right_arrow_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_arrow_left_square</i>
<span class="icon-name">arrow_right_arrow_left_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_arrow_left_square_fill</i>
<span class="icon-name">arrow_right_arrow_left_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_circle</i>
<span class="icon-name">arrow_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_circle_fill</i>
<span class="icon-name">arrow_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_square</i>
<span class="icon-name">arrow_right_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_square_fill</i>
<span class="icon-name">arrow_right_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_to_line</i>
<span class="icon-name">arrow_right_to_line</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_right_to_line_alt</i>
<span class="icon-name">arrow_right_to_line_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_swap</i>
<span class="icon-name">arrow_swap</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_down_left</i>
<span class="icon-name">arrow_turn_down_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_down_right</i>
<span class="icon-name">arrow_turn_down_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_left_down</i>
<span class="icon-name">arrow_turn_left_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_left_up</i>
<span class="icon-name">arrow_turn_left_up</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_right_down</i>
<span class="icon-name">arrow_turn_right_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_right_up</i>
<span class="icon-name">arrow_turn_right_up</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_up_left</i>
<span class="icon-name">arrow_turn_up_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_turn_up_right</i>
<span class="icon-name">arrow_turn_up_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up</i>
<span class="icon-name">arrow_up</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_arrow_down</i>
<span class="icon-name">arrow_up_arrow_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_arrow_down_circle</i>
<span class="icon-name">arrow_up_arrow_down_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_arrow_down_circle_fill</i>
<span class="icon-name">arrow_up_arrow_down_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_arrow_down_square</i>
<span class="icon-name">arrow_up_arrow_down_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_arrow_down_square_fill</i>
<span class="icon-name">arrow_up_arrow_down_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_bin</i>
<span class="icon-name">arrow_up_bin</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_bin_fill</i>
<span class="icon-name">arrow_up_bin_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_circle</i>
<span class="icon-name">arrow_up_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_circle_fill</i>
<span class="icon-name">arrow_up_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_doc</i>
<span class="icon-name">arrow_up_doc</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_doc_fill</i>
<span class="icon-name">arrow_up_doc_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_down</i>
<span class="icon-name">arrow_up_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_down_circle</i>
<span class="icon-name">arrow_up_down_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_down_circle_fill</i>
<span class="icon-name">arrow_up_down_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_down_square</i>
<span class="icon-name">arrow_up_down_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_down_square_fill</i>
<span class="icon-name">arrow_up_down_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_left</i>
<span class="icon-name">arrow_up_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_left_arrow_down_right</i>
<span class="icon-name">arrow_up_left_arrow_down_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_left_circle</i>
<span class="icon-name">arrow_up_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_left_circle_fill</i>
<span class="icon-name">arrow_up_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_left_square</i>
<span class="icon-name">arrow_up_left_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_left_square_fill</i>
<span class="icon-name">arrow_up_left_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_right</i>
<span class="icon-name">arrow_up_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_right_circle</i>
<span class="icon-name">arrow_up_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_right_circle_fill</i>
<span class="icon-name">arrow_up_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_right_diamond</i>
<span class="icon-name">arrow_up_right_diamond</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_right_diamond_fill</i>
<span class="icon-name">arrow_up_right_diamond_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_right_square</i>
<span class="icon-name">arrow_up_right_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_right_square_fill</i>
<span class="icon-name">arrow_up_right_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_square</i>
<span class="icon-name">arrow_up_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_square_fill</i>
<span class="icon-name">arrow_up_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_to_line</i>
<span class="icon-name">arrow_up_to_line</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_up_to_line_alt</i>
<span class="icon-name">arrow_up_to_line_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_down</i>
<span class="icon-name">arrow_uturn_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_down_circle</i>
<span class="icon-name">arrow_uturn_down_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_down_circle_fill</i>
<span class="icon-name">arrow_uturn_down_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_down_square</i>
<span class="icon-name">arrow_uturn_down_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_down_square_fill</i>
<span class="icon-name">arrow_uturn_down_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_left</i>
<span class="icon-name">arrow_uturn_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_left_circle</i>
<span class="icon-name">arrow_uturn_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_left_circle_fill</i>
<span class="icon-name">arrow_uturn_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_left_square</i>
<span class="icon-name">arrow_uturn_left_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_left_square_fill</i>
<span class="icon-name">arrow_uturn_left_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_right</i>
<span class="icon-name">arrow_uturn_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_right_circle</i>
<span class="icon-name">arrow_uturn_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_right_circle_fill</i>
<span class="icon-name">arrow_uturn_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_right_square</i>
<span class="icon-name">arrow_uturn_right_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_right_square_fill</i>
<span class="icon-name">arrow_uturn_right_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_up</i>
<span class="icon-name">arrow_uturn_up</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_up_circle</i>
<span class="icon-name">arrow_uturn_up_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_up_circle_fill</i>
<span class="icon-name">arrow_uturn_up_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_up_square</i>
<span class="icon-name">arrow_uturn_up_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrow_uturn_up_square_fill</i>
<span class="icon-name">arrow_uturn_up_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_left</i>
<span class="icon-name">arrowshape_turn_up_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_left_2</i>
<span class="icon-name">arrowshape_turn_up_left_2</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_left_2_fill</i>
<span class="icon-name">arrowshape_turn_up_left_2_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_left_circle</i>
<span class="icon-name">arrowshape_turn_up_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_left_circle_fill</i>
<span class="icon-name">arrowshape_turn_up_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_left_fill</i>
<span class="icon-name">arrowshape_turn_up_left_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_right</i>
<span class="icon-name">arrowshape_turn_up_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_right_circle</i>
<span class="icon-name">arrowshape_turn_up_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_right_circle_fill</i>
<span class="icon-name">arrowshape_turn_up_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowshape_turn_up_right_fill</i>
<span class="icon-name">arrowshape_turn_up_right_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_down</i>
<span class="icon-name">arrowtriangle_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_down_circle</i>
<span class="icon-name">arrowtriangle_down_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_down_circle_fill</i>
<span class="icon-name">arrowtriangle_down_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_down_fill</i>
<span class="icon-name">arrowtriangle_down_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_down_square</i>
<span class="icon-name">arrowtriangle_down_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_down_square_fill</i>
<span class="icon-name">arrowtriangle_down_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_left</i>
<span class="icon-name">arrowtriangle_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_left_circle</i>
<span class="icon-name">arrowtriangle_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_left_circle_fill</i>
<span class="icon-name">arrowtriangle_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_left_fill</i>
<span class="icon-name">arrowtriangle_left_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_left_square</i>
<span class="icon-name">arrowtriangle_left_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_left_square_fill</i>
<span class="icon-name">arrowtriangle_left_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_right</i>
<span class="icon-name">arrowtriangle_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_right_circle</i>
<span class="icon-name">arrowtriangle_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_right_circle_fill</i>
<span class="icon-name">arrowtriangle_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_right_fill</i>
<span class="icon-name">arrowtriangle_right_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_right_square</i>
<span class="icon-name">arrowtriangle_right_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_right_square_fill</i>
<span class="icon-name">arrowtriangle_right_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_up</i>
<span class="icon-name">arrowtriangle_up</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_up_circle</i>
<span class="icon-name">arrowtriangle_up_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_up_circle_fill</i>
<span class="icon-name">arrowtriangle_up_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_up_fill</i>
<span class="icon-name">arrowtriangle_up_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_up_square</i>
<span class="icon-name">arrowtriangle_up_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">arrowtriangle_up_square_fill</i>
<span class="icon-name">arrowtriangle_up_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">asterisk_circle</i>
<span class="icon-name">asterisk_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">asterisk_circle_fill</i>
<span class="icon-name">asterisk_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">at</i>
<span class="icon-name">at</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">at_badge_minus</i>
<span class="icon-name">at_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">at_badge_plus</i>
<span class="icon-name">at_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">at_circle</i>
<span class="icon-name">at_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">at_circle_fill</i>
<span class="icon-name">at_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">backward</i>
<span class="icon-name">backward</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">backward_end</i>
<span class="icon-name">backward_end</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">backward_end_alt</i>
<span class="icon-name">backward_end_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">backward_end_alt_fill</i>
<span class="icon-name">backward_end_alt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">backward_end_fill</i>
<span class="icon-name">backward_end_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">backward_fill</i>
<span class="icon-name">backward_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">badge_plus_radiowaves_right</i>
<span class="icon-name">badge_plus_radiowaves_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bag</i>
<span class="icon-name">bag</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bag_badge_minus</i>
<span class="icon-name">bag_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bag_badge_plus</i>
<span class="icon-name">bag_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bag_fill</i>
<span class="icon-name">bag_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bag_fill_badge_minus</i>
<span class="icon-name">bag_fill_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bag_fill_badge_plus</i>
<span class="icon-name">bag_fill_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bandage</i>
<span class="icon-name">bandage</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bandage_fill</i>
<span class="icon-name">bandage_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">barcode</i>
<span class="icon-name">barcode</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">barcode_viewfinder</i>
<span class="icon-name">barcode_viewfinder</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bars</i>
<span class="icon-name">bars</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">battery_0</i>
<span class="icon-name">battery_0</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">battery_100</i>
<span class="icon-name">battery_100</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">battery_25</i>
<span class="icon-name">battery_25</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bed_double</i>
<span class="icon-name">bed_double</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bed_double_fill</i>
<span class="icon-name">bed_double_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bell</i>
<span class="icon-name">bell</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bell_circle</i>
<span class="icon-name">bell_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bell_circle_fill</i>
<span class="icon-name">bell_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bell_fill</i>
<span class="icon-name">bell_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bell_slash</i>
<span class="icon-name">bell_slash</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bell_slash_fill</i>
<span class="icon-name">bell_slash_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bin_xmark</i>
<span class="icon-name">bin_xmark</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bin_xmark_fill</i>
<span class="icon-name">bin_xmark_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bitcoin</i>
<span class="icon-name">bitcoin</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bitcoin_circle</i>
<span class="icon-name">bitcoin_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bitcoin_circle_fill</i>
<span class="icon-name">bitcoin_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bluetooth</i>
<span class="icon-name">bluetooth</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bold</i>
<span class="icon-name">bold</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bold_italic_underline</i>
<span class="icon-name">bold_italic_underline</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bold_underline</i>
<span class="icon-name">bold_underline</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt</i>
<span class="icon-name">bolt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_badge_a</i>
<span class="icon-name">bolt_badge_a</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_badge_a_fill</i>
<span class="icon-name">bolt_badge_a_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_circle</i>
<span class="icon-name">bolt_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_circle_fill</i>
<span class="icon-name">bolt_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_fill</i>
<span class="icon-name">bolt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_horizontal</i>
<span class="icon-name">bolt_horizontal</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_horizontal_circle</i>
<span class="icon-name">bolt_horizontal_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_horizontal_circle_fill</i>
<span class="icon-name">bolt_horizontal_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_horizontal_fill</i>
<span class="icon-name">bolt_horizontal_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_slash</i>
<span class="icon-name">bolt_slash</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bolt_slash_fill</i>
<span class="icon-name">bolt_slash_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">book</i>
<span class="icon-name">book</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">book_circle</i>
<span class="icon-name">book_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">book_circle_fill</i>
<span class="icon-name">book_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">book_fill</i>
<span class="icon-name">book_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bookmark</i>
<span class="icon-name">bookmark</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bookmark_fill</i>
<span class="icon-name">bookmark_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">briefcase</i>
<span class="icon-name">briefcase</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">briefcase_fill</i>
<span class="icon-name">briefcase_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_left</i>
<span class="icon-name">bubble_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_left_bubble_right</i>
<span class="icon-name">bubble_left_bubble_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_left_bubble_right_fill</i>
<span class="icon-name">bubble_left_bubble_right_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_left_fill</i>
<span class="icon-name">bubble_left_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_middle_bottom</i>
<span class="icon-name">bubble_middle_bottom</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_middle_bottom_fill</i>
<span class="icon-name">bubble_middle_bottom_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_middle_top</i>
<span class="icon-name">bubble_middle_top</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_middle_top_fill</i>
<span class="icon-name">bubble_middle_top_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_right</i>
<span class="icon-name">bubble_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bubble_right_fill</i>
<span class="icon-name">bubble_right_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">building_2_fill</i>
<span class="icon-name">building_2_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">burn</i>
<span class="icon-name">burn</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">burst</i>
<span class="icon-name">burst</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">burst_fill</i>
<span class="icon-name">burst_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">bus</i>
<span class="icon-name">bus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">calendar</i>
<span class="icon-name">calendar</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">calendar_badge_minus</i>
<span class="icon-name">calendar_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">calendar_badge_plus</i>
<span class="icon-name">calendar_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">calendar_circle</i>
<span class="icon-name">calendar_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">calendar_circle_fill</i>
<span class="icon-name">calendar_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">calendar_today</i>
<span class="icon-name">calendar_today</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera</i>
<span class="icon-name">camera</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_circle</i>
<span class="icon-name">camera_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_circle_fill</i>
<span class="icon-name">camera_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_fill</i>
<span class="icon-name">camera_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_on_rectangle</i>
<span class="icon-name">camera_on_rectangle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_on_rectangle_fill</i>
<span class="icon-name">camera_on_rectangle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_rotate</i>
<span class="icon-name">camera_rotate</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_rotate_fill</i>
<span class="icon-name">camera_rotate_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">camera_viewfinder</i>
<span class="icon-name">camera_viewfinder</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">capslock</i>
<span class="icon-name">capslock</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">capslock_fill</i>
<span class="icon-name">capslock_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">capsule</i>
<span class="icon-name">capsule</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">capsule_fill</i>
<span class="icon-name">capsule_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">captions_bubble</i>
<span class="icon-name">captions_bubble</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">captions_bubble_fill</i>
<span class="icon-name">captions_bubble_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">car</i>
<span class="icon-name">car</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">car_detailed</i>
<span class="icon-name">car_detailed</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">car_fill</i>
<span class="icon-name">car_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cart</i>
<span class="icon-name">cart</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cart_badge_minus</i>
<span class="icon-name">cart_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cart_badge_plus</i>
<span class="icon-name">cart_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cart_fill</i>
<span class="icon-name">cart_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cart_fill_badge_minus</i>
<span class="icon-name">cart_fill_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cart_fill_badge_plus</i>
<span class="icon-name">cart_fill_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_bar</i>
<span class="icon-name">chart_bar</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_bar_alt_fill</i>
<span class="icon-name">chart_bar_alt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_bar_circle</i>
<span class="icon-name">chart_bar_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_bar_circle_fill</i>
<span class="icon-name">chart_bar_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_bar_fill</i>
<span class="icon-name">chart_bar_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_bar_square</i>
<span class="icon-name">chart_bar_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_bar_square_fill</i>
<span class="icon-name">chart_bar_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_pie</i>
<span class="icon-name">chart_pie</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chart_pie_fill</i>
<span class="icon-name">chart_pie_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chat_bubble</i>
<span class="icon-name">chat_bubble</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chat_bubble_2</i>
<span class="icon-name">chat_bubble_2</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chat_bubble_2_fill</i>
<span class="icon-name">chat_bubble_2_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chat_bubble_fill</i>
<span class="icon-name">chat_bubble_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chat_bubble_text</i>
<span class="icon-name">chat_bubble_text</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chat_bubble_text_fill</i>
<span class="icon-name">chat_bubble_text_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark</i>
<span class="icon-name">checkmark</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_alt</i>
<span class="icon-name">checkmark_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_alt_circle</i>
<span class="icon-name">checkmark_alt_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_alt_circle_fill</i>
<span class="icon-name">checkmark_alt_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_circle</i>
<span class="icon-name">checkmark_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_circle_fill</i>
<span class="icon-name">checkmark_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_rectangle</i>
<span class="icon-name">checkmark_rectangle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_rectangle_fill</i>
<span class="icon-name">checkmark_rectangle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_seal</i>
<span class="icon-name">checkmark_seal</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_seal_fill</i>
<span class="icon-name">checkmark_seal_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_shield</i>
<span class="icon-name">checkmark_shield</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_shield_fill</i>
<span class="icon-name">checkmark_shield_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_square</i>
<span class="icon-name">checkmark_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">checkmark_square_fill</i>
<span class="icon-name">checkmark_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_back</i>
<span class="icon-name">chevron_back</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_compact_down</i>
<span class="icon-name">chevron_compact_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_compact_left</i>
<span class="icon-name">chevron_compact_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_compact_right</i>
<span class="icon-name">chevron_compact_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_compact_up</i>
<span class="icon-name">chevron_compact_up</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_down</i>
<span class="icon-name">chevron_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_down_circle</i>
<span class="icon-name">chevron_down_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_down_circle_fill</i>
<span class="icon-name">chevron_down_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_down_square</i>
<span class="icon-name">chevron_down_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_down_square_fill</i>
<span class="icon-name">chevron_down_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_forward</i>
<span class="icon-name">chevron_forward</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_left</i>
<span class="icon-name">chevron_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_left_2</i>
<span class="icon-name">chevron_left_2</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_left_circle</i>
<span class="icon-name">chevron_left_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_left_circle_fill</i>
<span class="icon-name">chevron_left_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_left_slash_chevron_right</i>
<span class="icon-name">chevron_left_slash_chevron_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_left_square</i>
<span class="icon-name">chevron_left_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_left_square_fill</i>
<span class="icon-name">chevron_left_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_right</i>
<span class="icon-name">chevron_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_right_2</i>
<span class="icon-name">chevron_right_2</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_right_circle</i>
<span class="icon-name">chevron_right_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_right_circle_fill</i>
<span class="icon-name">chevron_right_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_right_square</i>
<span class="icon-name">chevron_right_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_right_square_fill</i>
<span class="icon-name">chevron_right_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_up</i>
<span class="icon-name">chevron_up</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_up_chevron_down</i>
<span class="icon-name">chevron_up_chevron_down</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_up_circle</i>
<span class="icon-name">chevron_up_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_up_circle_fill</i>
<span class="icon-name">chevron_up_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_up_square</i>
<span class="icon-name">chevron_up_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">chevron_up_square_fill</i>
<span class="icon-name">chevron_up_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle</i>
<span class="icon-name">circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_bottomthird_split</i>
<span class="icon-name">circle_bottomthird_split</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_fill</i>
<span class="icon-name">circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_grid_3x3</i>
<span class="icon-name">circle_grid_3x3</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_grid_3x3_fill</i>
<span class="icon-name">circle_grid_3x3_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_grid_hex</i>
<span class="icon-name">circle_grid_hex</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_grid_hex_fill</i>
<span class="icon-name">circle_grid_hex_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_lefthalf_fill</i>
<span class="icon-name">circle_lefthalf_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">circle_righthalf_fill</i>
<span class="icon-name">circle_righthalf_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">clear</i>
<span class="icon-name">clear</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">clear_fill</i>
<span class="icon-name">clear_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">clock</i>
<span class="icon-name">clock</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">clock_fill</i>
<span class="icon-name">clock_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud</i>
<span class="icon-name">cloud</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_bolt</i>
<span class="icon-name">cloud_bolt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_bolt_fill</i>
<span class="icon-name">cloud_bolt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_bolt_rain</i>
<span class="icon-name">cloud_bolt_rain</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_bolt_rain_fill</i>
<span class="icon-name">cloud_bolt_rain_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_download</i>
<span class="icon-name">cloud_download</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_download_fill</i>
<span class="icon-name">cloud_download_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_drizzle</i>
<span class="icon-name">cloud_drizzle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_drizzle_fill</i>
<span class="icon-name">cloud_drizzle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_fill</i>
<span class="icon-name">cloud_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_fog</i>
<span class="icon-name">cloud_fog</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_fog_fill</i>
<span class="icon-name">cloud_fog_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_hail</i>
<span class="icon-name">cloud_hail</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_hail_fill</i>
<span class="icon-name">cloud_hail_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_heavyrain</i>
<span class="icon-name">cloud_heavyrain</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_heavyrain_fill</i>
<span class="icon-name">cloud_heavyrain_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_moon</i>
<span class="icon-name">cloud_moon</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_moon_bolt</i>
<span class="icon-name">cloud_moon_bolt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_moon_bolt_fill</i>
<span class="icon-name">cloud_moon_bolt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_moon_fill</i>
<span class="icon-name">cloud_moon_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_moon_rain</i>
<span class="icon-name">cloud_moon_rain</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_moon_rain_fill</i>
<span class="icon-name">cloud_moon_rain_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_rain</i>
<span class="icon-name">cloud_rain</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_rain_fill</i>
<span class="icon-name">cloud_rain_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sleet</i>
<span class="icon-name">cloud_sleet</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sleet_fill</i>
<span class="icon-name">cloud_sleet_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_snow</i>
<span class="icon-name">cloud_snow</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_snow_fill</i>
<span class="icon-name">cloud_snow_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sun</i>
<span class="icon-name">cloud_sun</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sun_bolt</i>
<span class="icon-name">cloud_sun_bolt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sun_bolt_fill</i>
<span class="icon-name">cloud_sun_bolt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sun_fill</i>
<span class="icon-name">cloud_sun_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sun_rain</i>
<span class="icon-name">cloud_sun_rain</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_sun_rain_fill</i>
<span class="icon-name">cloud_sun_rain_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_upload</i>
<span class="icon-name">cloud_upload</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cloud_upload_fill</i>
<span class="icon-name">cloud_upload_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">color_filter</i>
<span class="icon-name">color_filter</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">color_filter_fill</i>
<span class="icon-name">color_filter_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">command</i>
<span class="icon-name">command</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">compass</i>
<span class="icon-name">compass</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">compass_fill</i>
<span class="icon-name">compass_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">control</i>
<span class="icon-name">control</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">creditcard</i>
<span class="icon-name">creditcard</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">creditcard_fill</i>
<span class="icon-name">creditcard_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">crop</i>
<span class="icon-name">crop</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">crop_rotate</i>
<span class="icon-name">crop_rotate</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cube</i>
<span class="icon-name">cube</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cube_box</i>
<span class="icon-name">cube_box</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cube_box_fill</i>
<span class="icon-name">cube_box_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cube_fill</i>
<span class="icon-name">cube_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">cursor_rays</i>
<span class="icon-name">cursor_rays</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">decrease_indent</i>
<span class="icon-name">decrease_indent</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">decrease_quotelevel</i>
<span class="icon-name">decrease_quotelevel</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">delete_left</i>
<span class="icon-name">delete_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">delete_left_fill</i>
<span class="icon-name">delete_left_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">delete_right</i>
<span class="icon-name">delete_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">delete_right_fill</i>
<span class="icon-name">delete_right_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">desktopcomputer</i>
<span class="icon-name">desktopcomputer</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">device_desktop</i>
<span class="icon-name">device_desktop</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">device_laptop</i>
<span class="icon-name">device_laptop</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">device_phone_landscape</i>
<span class="icon-name">device_phone_landscape</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">device_phone_portrait</i>
<span class="icon-name">device_phone_portrait</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">dial</i>
<span class="icon-name">dial</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">dial_fill</i>
<span class="icon-name">dial_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">divide</i>
<span class="icon-name">divide</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">divide_circle</i>
<span class="icon-name">divide_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">divide_circle_fill</i>
<span class="icon-name">divide_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">divide_square</i>
<span class="icon-name">divide_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">divide_square_fill</i>
<span class="icon-name">divide_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc</i>
<span class="icon-name">doc</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_append</i>
<span class="icon-name">doc_append</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_chart</i>
<span class="icon-name">doc_chart</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_chart_fill</i>
<span class="icon-name">doc_chart_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_checkmark</i>
<span class="icon-name">doc_checkmark</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_checkmark_fill</i>
<span class="icon-name">doc_checkmark_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_circle</i>
<span class="icon-name">doc_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_circle_fill</i>
<span class="icon-name">doc_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_fill</i>
<span class="icon-name">doc_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_on_clipboard</i>
<span class="icon-name">doc_on_clipboard</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_on_clipboard_fill</i>
<span class="icon-name">doc_on_clipboard_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_on_doc</i>
<span class="icon-name">doc_on_doc</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_on_doc_fill</i>
<span class="icon-name">doc_on_doc_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_person</i>
<span class="icon-name">doc_person</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_person_fill</i>
<span class="icon-name">doc_person_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_plaintext</i>
<span class="icon-name">doc_plaintext</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_richtext</i>
<span class="icon-name">doc_richtext</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_text</i>
<span class="icon-name">doc_text</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_text_fill</i>
<span class="icon-name">doc_text_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_text_search</i>
<span class="icon-name">doc_text_search</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">doc_text_viewfinder</i>
<span class="icon-name">doc_text_viewfinder</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">dot_radiowaves_left_right</i>
<span class="icon-name">dot_radiowaves_left_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">dot_radiowaves_right</i>
<span class="icon-name">dot_radiowaves_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">dot_square</i>
<span class="icon-name">dot_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">dot_square_fill</i>
<span class="icon-name">dot_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">download_circle</i>
<span class="icon-name">download_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">download_circle_fill</i>
<span class="icon-name">download_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">drop</i>
<span class="icon-name">drop</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">drop_fill</i>
<span class="icon-name">drop_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">drop_triangle</i>
<span class="icon-name">drop_triangle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">drop_triangle_fill</i>
<span class="icon-name">drop_triangle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ear</i>
<span class="icon-name">ear</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eject</i>
<span class="icon-name">eject</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eject_fill</i>
<span class="icon-name">eject_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipses_bubble</i>
<span class="icon-name">ellipses_bubble</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipses_bubble_fill</i>
<span class="icon-name">ellipses_bubble_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipsis</i>
<span class="icon-name">ellipsis</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipsis_circle</i>
<span class="icon-name">ellipsis_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipsis_circle_fill</i>
<span class="icon-name">ellipsis_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipsis_vertical</i>
<span class="icon-name">ellipsis_vertical</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipsis_vertical_circle</i>
<span class="icon-name">ellipsis_vertical_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">ellipsis_vertical_circle_fill</i>
<span class="icon-name">ellipsis_vertical_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope</i>
<span class="icon-name">envelope</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope_badge</i>
<span class="icon-name">envelope_badge</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope_badge_fill</i>
<span class="icon-name">envelope_badge_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope_circle</i>
<span class="icon-name">envelope_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope_circle_fill</i>
<span class="icon-name">envelope_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope_fill</i>
<span class="icon-name">envelope_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope_open</i>
<span class="icon-name">envelope_open</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">envelope_open_fill</i>
<span class="icon-name">envelope_open_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">equal</i>
<span class="icon-name">equal</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">equal_circle</i>
<span class="icon-name">equal_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">equal_circle_fill</i>
<span class="icon-name">equal_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">equal_square</i>
<span class="icon-name">equal_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">equal_square_fill</i>
<span class="icon-name">equal_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">escape</i>
<span class="icon-name">escape</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark</i>
<span class="icon-name">exclamationmark</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_bubble</i>
<span class="icon-name">exclamationmark_bubble</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_bubble_fill</i>
<span class="icon-name">exclamationmark_bubble_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_circle</i>
<span class="icon-name">exclamationmark_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_circle_fill</i>
<span class="icon-name">exclamationmark_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_octagon</i>
<span class="icon-name">exclamationmark_octagon</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_octagon_fill</i>
<span class="icon-name">exclamationmark_octagon_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_shield</i>
<span class="icon-name">exclamationmark_shield</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_shield_fill</i>
<span class="icon-name">exclamationmark_shield_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_square</i>
<span class="icon-name">exclamationmark_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_square_fill</i>
<span class="icon-name">exclamationmark_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_triangle</i>
<span class="icon-name">exclamationmark_triangle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">exclamationmark_triangle_fill</i>
<span class="icon-name">exclamationmark_triangle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eye</i>
<span class="icon-name">eye</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eye_fill</i>
<span class="icon-name">eye_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eye_slash</i>
<span class="icon-name">eye_slash</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eye_slash_fill</i>
<span class="icon-name">eye_slash_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eyedropper</i>
<span class="icon-name">eyedropper</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eyedropper_full</i>
<span class="icon-name">eyedropper_full</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eyedropper_halffull</i>
<span class="icon-name">eyedropper_halffull</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">eyeglasses</i>
<span class="icon-name">eyeglasses</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">f_cursive</i>
<span class="icon-name">f_cursive</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">f_cursive_circle</i>
<span class="icon-name">f_cursive_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">f_cursive_circle_fill</i>
<span class="icon-name">f_cursive_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">film</i>
<span class="icon-name">film</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">film_fill</i>
<span class="icon-name">film_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flag</i>
<span class="icon-name">flag</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flag_circle</i>
<span class="icon-name">flag_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flag_circle_fill</i>
<span class="icon-name">flag_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flag_fill</i>
<span class="icon-name">flag_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flag_slash</i>
<span class="icon-name">flag_slash</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flag_slash_fill</i>
<span class="icon-name">flag_slash_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flame</i>
<span class="icon-name">flame</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flame_fill</i>
<span class="icon-name">flame_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">floppy_disk</i>
<span class="icon-name">floppy_disk</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flowchart</i>
<span class="icon-name">flowchart</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">flowchart_fill</i>
<span class="icon-name">flowchart_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder</i>
<span class="icon-name">folder</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_badge_minus</i>
<span class="icon-name">folder_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_badge_person_crop</i>
<span class="icon-name">folder_badge_person_crop</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_badge_plus</i>
<span class="icon-name">folder_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_circle</i>
<span class="icon-name">folder_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_circle_fill</i>
<span class="icon-name">folder_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_fill</i>
<span class="icon-name">folder_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_fill_badge_minus</i>
<span class="icon-name">folder_fill_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_fill_badge_person_crop</i>
<span class="icon-name">folder_fill_badge_person_crop</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">folder_fill_badge_plus</i>
<span class="icon-name">folder_fill_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">forward</i>
<span class="icon-name">forward</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">forward_end</i>
<span class="icon-name">forward_end</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">forward_end_alt</i>
<span class="icon-name">forward_end_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">forward_end_alt_fill</i>
<span class="icon-name">forward_end_alt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">forward_end_fill</i>
<span class="icon-name">forward_end_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">forward_fill</i>
<span class="icon-name">forward_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">function</i>
<span class="icon-name">function</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">fx</i>
<span class="icon-name">fx</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gamecontroller</i>
<span class="icon-name">gamecontroller</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gamecontroller_alt_fill</i>
<span class="icon-name">gamecontroller_alt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gamecontroller_fill</i>
<span class="icon-name">gamecontroller_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gauge</i>
<span class="icon-name">gauge</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gauge_badge_minus</i>
<span class="icon-name">gauge_badge_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gauge_badge_plus</i>
<span class="icon-name">gauge_badge_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gear</i>
<span class="icon-name">gear</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gear_alt</i>
<span class="icon-name">gear_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gear_alt_fill</i>
<span class="icon-name">gear_alt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gift</i>
<span class="icon-name">gift</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gift_alt</i>
<span class="icon-name">gift_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gift_alt_fill</i>
<span class="icon-name">gift_alt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gift_fill</i>
<span class="icon-name">gift_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">globe</i>
<span class="icon-name">globe</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward</i>
<span class="icon-name">gobackward</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_10</i>
<span class="icon-name">gobackward_10</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_15</i>
<span class="icon-name">gobackward_15</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_30</i>
<span class="icon-name">gobackward_30</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_45</i>
<span class="icon-name">gobackward_45</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_60</i>
<span class="icon-name">gobackward_60</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_75</i>
<span class="icon-name">gobackward_75</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_90</i>
<span class="icon-name">gobackward_90</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">gobackward_minus</i>
<span class="icon-name">gobackward_minus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward</i>
<span class="icon-name">goforward</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_10</i>
<span class="icon-name">goforward_10</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_15</i>
<span class="icon-name">goforward_15</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_30</i>
<span class="icon-name">goforward_30</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_45</i>
<span class="icon-name">goforward_45</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_60</i>
<span class="icon-name">goforward_60</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_75</i>
<span class="icon-name">goforward_75</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_90</i>
<span class="icon-name">goforward_90</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">goforward_plus</i>
<span class="icon-name">goforward_plus</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">graph_circle</i>
<span class="icon-name">graph_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">graph_circle_fill</i>
<span class="icon-name">graph_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">graph_square</i>
<span class="icon-name">graph_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">graph_square_fill</i>
<span class="icon-name">graph_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">greaterthan</i>
<span class="icon-name">greaterthan</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">greaterthan_circle</i>
<span class="icon-name">greaterthan_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">greaterthan_circle_fill</i>
<span class="icon-name">greaterthan_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">greaterthan_square</i>
<span class="icon-name">greaterthan_square</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">greaterthan_square_fill</i>
<span class="icon-name">greaterthan_square_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">grid</i>
<span class="icon-name">grid</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">grid_circle</i>
<span class="icon-name">grid_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">grid_circle_fill</i>
<span class="icon-name">grid_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">guitars</i>
<span class="icon-name">guitars</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hammer</i>
<span class="icon-name">hammer</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hammer_fill</i>
<span class="icon-name">hammer_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_draw</i>
<span class="icon-name">hand_draw</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_draw_fill</i>
<span class="icon-name">hand_draw_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_point_left</i>
<span class="icon-name">hand_point_left</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_point_left_fill</i>
<span class="icon-name">hand_point_left_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_point_right</i>
<span class="icon-name">hand_point_right</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_point_right_fill</i>
<span class="icon-name">hand_point_right_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_raised</i>
<span class="icon-name">hand_raised</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_raised_fill</i>
<span class="icon-name">hand_raised_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_raised_slash</i>
<span class="icon-name">hand_raised_slash</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_raised_slash_fill</i>
<span class="icon-name">hand_raised_slash_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_thumbsdown</i>
<span class="icon-name">hand_thumbsdown</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_thumbsdown_fill</i>
<span class="icon-name">hand_thumbsdown_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_thumbsup</i>
<span class="icon-name">hand_thumbsup</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hand_thumbsup_fill</i>
<span class="icon-name">hand_thumbsup_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hare</i>
<span class="icon-name">hare</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hare_fill</i>
<span class="icon-name">hare_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">headphones</i>
<span class="icon-name">headphones</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart</i>
<span class="icon-name">heart</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart_circle</i>
<span class="icon-name">heart_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart_circle_fill</i>
<span class="icon-name">heart_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart_fill</i>
<span class="icon-name">heart_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart_slash</i>
<span class="icon-name">heart_slash</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart_slash_circle</i>
<span class="icon-name">heart_slash_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart_slash_circle_fill</i>
<span class="icon-name">heart_slash_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">heart_slash_fill</i>
<span class="icon-name">heart_slash_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">helm</i>
<span class="icon-name">helm</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hexagon</i>
<span class="icon-name">hexagon</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hexagon_fill</i>
<span class="icon-name">hexagon_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hifispeaker</i>
<span class="icon-name">hifispeaker</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hifispeaker_fill</i>
<span class="icon-name">hifispeaker_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hourglass</i>
<span class="icon-name">hourglass</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hourglass_bottomhalf_fill</i>
<span class="icon-name">hourglass_bottomhalf_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hourglass_tophalf_fill</i>
<span class="icon-name">hourglass_tophalf_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">house</i>
<span class="icon-name">house</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">house_alt</i>
<span class="icon-name">house_alt</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">house_alt_fill</i>
<span class="icon-name">house_alt_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">house_fill</i>
<span class="icon-name">house_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">hurricane</i>
<span class="icon-name">hurricane</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">increase_indent</i>
<span class="icon-name">increase_indent</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">increase_quotelevel</i>
<span class="icon-name">increase_quotelevel</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">infinite</i>
<span class="icon-name">infinite</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">info</i>
<span class="icon-name">info</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">info_circle</i>
<span class="icon-name">info_circle</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">info_circle_fill</i>
<span class="icon-name">info_circle_fill</span>
</div>
<div class="icon-cell">
<i class="cupertino-icons size-28">italic</i>
<span class="icon-name">italic</span>
</div>
<div class="icon-cell">
<i class="cup