登录 注册
开源 企业版 高校版 私有云 Gitee AI NEW
扫描微信二维码支付
取消
支付完成
Watch
不关注 关注所有动态 仅关注版本发行动态 关注但不提醒动态
1 Star 0 Fork 0

ZHANGXIN / XTicon 1300+图标库

代码 Issues 0 Pull Requests 0 Wiki 统计 流水线
服务
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目，私有仓库也完全免费 ：）
免费加入
克隆/下载
index.html 16.05 KB
一键复制 编辑 原始数据 按行查看 历史
ZHANGXIN 提交于 2024-01-05 07:52 . update index.html.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334
<!doctype html>

<html lang="zh-Hans">

<head>

    <meta charset="utf-8">

    <meta name="keywords" content="">

    <meta name="description" content="">

    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">

	<meta name="robots" content="index, follow">

    <link rel="shortcut icon" type="image/svg" href="favicon.svg">

    

	<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css?9991">

	<link rel="stylesheet" type="text/css" href="style.css?4537">

	<link rel="stylesheet" type="text/css" href="./css/animate.min.css?5032">

	<link rel="stylesheet" type="text/css" href="./css/feather.min.css">

	

    <title>XTicon - 1300+全场景图标合集</title>





    

<!-- Analytics -->

 

<!-- Analytics END -->

    

</head>

<body class="mob-disable-anim ">

<!-- Main container -->

<div class="page-container">

    

<!-- bloc-0 -->

<div class="bloc l-bloc full-width-bloc" id="bloc-0">

	<div class="container bloc-sm bloc-no-padding-lg">

		<div class="row">

			<div class="col pe-lg-5 ps-lg-5">

				<nav class="navbar navbar-light row navbar-expand-md ps-lg-0 pe-lg-0 pb-lg-0 pt-lg-0 mt-lg-3" role="navigation">

					<div class="container-fluid">

						<a class="navbar-brand img-protected" href="./"><img src="img/logo-nav.svg" alt="logo" width="270" height="24"></a>

						<div class="navbar-content-area col text-end">

							<a href="https://github.com/iwzt/XTicon" target="_blank"><img src="img/github.svg" class="img-fluid img-protected float-lg-end ms-lg-3" alt="github" width="24" height="24"></a><a href="https://gitee.com/ZHANGXIN090/xticon" target="_blank"><img src="img/gitee.svg" class="img-fluid img-protected float-lg-end ms-lg-3 ms-2" alt="github" width="24" height="24"></a><a href="https://dribbble.com/ZHANGXIN090" target="_blank"><img src="img/dribbble.svg" class="img-fluid img-protected float-lg-end ms-lg-3 ms-2" alt="github" width="24" height="24"></a><a href="./xticon-license/"><img src="img/license.svg" class="img-fluid img-protected float-lg-end ms-2" alt="github" width="24" height="24"></a>

						</div>

					</div>

				</nav>

			</div>

		</div>

	</div>

</div>

<!-- bloc-0 END -->



<!-- bloc-1 -->

<div class="bloc l-bloc full-width-bloc" id="bloc-1">

	<div class="container bloc-lg bloc-no-padding-lg bloc-no-padding-md bloc-no-padding-sm">

		<div class="row pe-lg-5 ps-lg-5 pt-lg-5 pe-md-5 ps-md-5 pb-lg-5 pb-md-5 pt-md-5 pe-sm-5 ps-sm-5 pb-sm-5 pt-sm-5">

			<div class="col-md-6 text-start pe-lg-0 ps-lg-0">

				<h1 class="mb-4 title-large text-start mb-lg-3">

					为您的项目精心准备的<br>全场景图标。

				</h1>

				<p class="home-miaoshu mb-lg-5">

					精心设计了1300+的图标，满足大部分设计场景。<br>同时也提供了几乎所有常用的图标库格式。<br>

				</p><a href="downloads/svg-XTicon.zip" class="btn btn-d btn-lg btn-fill-style" target="_blank">下载全部图标 &nbsp; &nbsp; &nbsp; &nbsp;→<br></a>

			</div>

			<div class="col-md-6 text-start pe-lg-0 ps-lg-0">

			</div>

		</div>

	</div>

</div>

<!-- bloc-1 END -->



<!-- bloc-2 -->

<div class="bloc l-bloc full-width-bloc" id="bloc-2">

	<div class="container bloc-lg bloc-sm-lg bloc-sm-md bloc-sm-sm">

		<div class="row">

			<div class="col-12">

				<div class="blocs-horizontal-scroll-container compact-blocs-controls">

					<div class="blocs-horizontal-scroll-control blocs-scroll-control-prev">

						<span class="blocs-round-btn"><svg width="26" height="26" viewBox="0 0 32 32"><path class="horizontal-scroll-icon" d="M22,2L9,16,22,30"></path></svg></span>

					</div>

					<div class="blocs-horizontal-scroll-area text-lg-center">

							<div class="row pe-lg-5 ps-lg-5 pt-lg-5 pb-lg-5 row-div pe-md-5 ps-md-5 pb-md-5 pe-sm-5 ps-sm-5 pb-sm-5 pt-sm-5">

								<div class="col card-format">

									<a href="downloads/svg-XTicon.zip" target="_blank"><img src="img/lazyload-ph.png" data-src="img/card-svg.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="placeholder image" width="64" height="64"></a><a href="downloads/svg-XTicon.zip" class="a-btn a-block card-url-text" target="_blank">.svg</a>

								</div>

								<div class="col card-format">

									<img src="img/lazyload-ph.png" data-src="img/card-sketch.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="placeholder image" width="64" height="64"><a href="./" class="a-btn a-block card-url-text">.sketch</a>

								</div>

								<div class="col card-format">

									<a href="downloads/xticon.iconjar.zip" target="_blank"><img src="img/lazyload-ph.png" data-src="img/card-iconjar.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="placeholder image" width="64" height="64"></a><a href="downloads/xticon.iconjar.zip" class="a-btn a-block card-url-text" target="_blank">.iconjar</a>

								</div>

								<div class="col card-format">

									<a href="https://www.iconfont.cn/user/detail?spm=a313x.icontype_collection.i3.41.64d83a81VMn1cD&uid=18449&nid=uWAKzTZ5zyY9" target="_blank"><img src="img/lazyload-ph.png" data-src="img/iconfont.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="placeholder image" width="64" height="64"></a><a href="https://www.iconfont.cn/user/detail?spm=a313x.icontype_collection.i3.41.64d83a81VMn1cD&uid=18449&nid=uWAKzTZ5zyY9" class="a-btn a-block card-url-text">.iconfont</a>

								</div>

								<div class="col card-format">

									<img src="img/lazyload-ph.png" data-src="img/card-figma.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="placeholder image" width="64" height="64"><a href="./" class="a-btn a-block card-url-text">.fig</a>

								</div>

								<div class="col card-format">

									<img src="img/lazyload-ph.png" data-src="img/card-ai.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="placeholder image" width="64" height="64"><a href="./" class="a-btn a-block card-url-text">.ai</a>

								</div>

							</div>

						</div>

					<div class="blocs-horizontal-scroll-control blocs-scroll-control-next">

							<span class="blocs-round-btn"><svg width="26" height="26" viewBox="0 0 32 32"><path class="horizontal-scroll-icon" d="M10.344,2l13,14-13,14"></path></svg></span>

						</div>

				</div>

			</div>

		</div>

	</div>

</div>

<!-- bloc-2 END -->



<!-- bloc-3 -->

<div class="bloc l-bloc" id="bloc-3">

	<div class="container bloc-lg">

		<div class="row">

			<div class="col text-start pe-lg-0 ps-lg-0 text-lg-center">

				<label class="form-label lable-title text-lg-center mb-lg-3">

					专为敏捷团队打造

				</label>

				<h1 class="mb-4 title-large text-start mb-lg-3 mx-auto d-block text-lg-center">

					面向B端产品的图标集合

				</h1>

				<p class="home-miaoshu mb-lg-5 p-style">

					专为电网行业打造的满足复杂、多样、全链路的业务图标，我们提供了超过1300+的覆盖全场景的图标集合<br>

				</p>

				<div class="row">

					<div class="col">

						<img src="img/lazyload-ph.png" data-src="img/1300-02.svg" class="img-fluid img-protected mx-auto d-block img-bg mb-lg-5 lazyload" alt="1300 01" width="691" height="251">

						<div class="row align-items-center row-text-align">

							<div class="col card-mar text-lg-start">

								<h3 class="mb-4 float-lg-none text-lg-start card-text-title mb-lg-0">

									即时通信、文档文件、地图等，应有尽有。

								</h3>

								<p class="card-text-miaoshu mb-lg-0">

									我们目前支持了剪头、文件、UI、日历、导航、提醒警告、用户、菜单、媒体等场景。

								</p>

							</div>

						</div>

						<div class="row align-items-center row-text-align pt-lg-5">

							<div class="col card-mar text-lg-start">

								<h3 class="mb-4 float-lg-none text-lg-start card-text-title mb-lg-0">

									海量图标，都满足了简单和一致。

								</h3>

								<p class="card-text-miaoshu mb-lg-0">

									XTicon提供了线性和面性的图标，当前支持Sketch Symbol切换，让你毫不费力的切换样式。

								</p>

							</div>

						</div>

					</div>

				</div>

			</div>

		</div>

	</div>

</div>

<!-- bloc-3 END -->



<!-- bloc-3-26793 -->

<div class="bloc l-bloc" id="bloc-3-26793">

	<div class="container bloc-lg">

		<div class="row">

			<div class="col text-start pe-lg-0 ps-lg-0 text-lg-center">

				<label class="form-label lable-title text-lg-center mb-lg-3">

					多风格图标<br>

				</label>

				<h1 class="mb-4 title-large text-start mb-lg-3 mx-auto d-block text-lg-center">

					4种样式足够满足项目需要

				</h1>

				<p class="home-miaoshu mb-lg-5 p-style">

					我们提供了线性、面性、填充、双色等4种图标样式。<br>

				</p>

				<div class="row">

					<div class="col-12">

						<div class="row">

							<div class="col">

								<img src="img/lazyload-ph.png" data-src="img/more-style-%20more-style-4.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="more style-%20more-style-4" width="273" height="273">

								<label class="form-label style-miaoshu">

									线性图标<br>

								</label>

							</div>

							<div class="col">

								<img src="img/lazyload-ph.png" data-src="img/more-style-%20more-style-2.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="more style-%20more-style-2" width="273" height="273">

								<label class="form-label style-miaoshu">

									轮廓图标<br>

								</label>

							</div>

							<div class="col">

								<img src="img/lazyload-ph.png" data-src="img/more-style-%20more-style-3.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="more style-%20more-style-3" width="273" height="273">

								<label class="form-label style-miaoshu">

									面性图标<br>

								</label>

							</div>

							<div class="col">

								<img src="img/lazyload-ph.png" data-src="img/more-style-%20more-style-1.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="more style-%20more-style-1" width="273" height="273">

								<label class="form-label style-miaoshu">

									双拼图标<br>

								</label>

							</div>

						</div>

					</div>

				</div>

			</div>

		</div>

	</div>

</div>

<!-- bloc-3-26793 END -->



<!-- bloc-5 -->

<div class="bloc bgc-1966 d-bloc" id="bloc-5">

	<div class="bloc-shape-divider bloc-divider-flip-y bloc-divider-top">

		<svg class="svg-divider bloc-divider-t-fill" fill-rule="evenodd" preserveAspectRatio="none" viewBox="0 0 1000 250"><path d="M357.275,125H1000V250H0S54,125,357.275,125Z"></path></svg>

	</div>

	<div class="container bloc-lg">

			<div class="row">

				<div class="col text-start text-lg-center mt-lg-5">

					<label class="form-label text-lg-center mb-lg-3 able-title-white">

						基于Sketch平滑圆角打造<br>

					</label>

					<h1 class="mb-4 text-start mb-lg-3 mx-auto d-block text-lg-center title-large-white">

						平滑，比圆角矩形更平滑。

					</h1>

					<p class="mb-lg-5 home-miaoshu-white">

						就像Apple设计定义的那样，我们也基于这样的平滑圆角定义了全局图标。<br>

					</p>

					<div class="row">

						<div class="col">

							<img src="img/lazyload-ph.png" data-src="img/yuanhua-01.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="yuanhua 01" width="558" height="279">

						</div>

						<div class="col">

							<img src="img/lazyload-ph.png" data-src="img/yuanhua-02.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="yuanhua 02" width="558" height="279">

						</div>

					</div>

					<div class="row pt-lg-4">

						<div class="col">

							<img src="img/lazyload-ph.png" data-src="img/yuanhua-03.svg" class="img-fluid img-protected mx-auto d-block lazyload" alt="yuanhua 03" width="1140" height="364"><a href="./" class="btn btn-d btn-lg button-line-white float-lg-none">Button &nbsp; &nbsp; &nbsp; &nbsp;→</a>

						</div>

					</div>

				</div>

			</div>

		</div>

</div>

<!-- bloc-5 END -->



<!-- bloc-6 -->

<div class="bloc bgc-1966 d-bloc" id="bloc-6">

	<div class="container bloc-lg">

		<div class="row">

			<div class="col text-start text-lg-center">

				<label class="form-label text-lg-center mb-lg-3 able-title-white">

					基于Sketch平滑圆角打造<br>

				</label>

				<h1 class="mb-4 text-start mb-lg-3 mx-auto d-block text-lg-center title-large-white">

					看一下，不止这些。

				</h1>

				<p class="mb-lg-5 home-miaoshu-white">

					我们基于电网行业创建了超过1300个全场景图标，拖至即用。<br>

				</p><picture><source type="image/webp" srcset="img/lazyload-ph.png" data-srcset="img/编组%2053.webp"><img src="img/lazyload-ph.png" data-src="img/编组%2053.png" class="img-fluid img-protected mx-auto d-block lazyload" alt="编组%2053" width="1140" height="459"></picture>

			</div>

		</div>

	</div>

</div>

<!-- bloc-6 END -->



<!-- bloc-7 -->

<div class="bloc bgc-1966 d-bloc" id="bloc-7">

	<div class="container bloc-lg">

		<div class="row">

			<div class="col text-start">

				<img class="img-fluid img-protected mx-auto d-block mb-lg-5 lazyload" src="img/lazyload-ph.png" data-src="img/footer-logo.svg" alt="footer logo" width="395" height="32">

				<div class="row">

					<div class="col text-lg-center">

						<a href="downloads/svg-XTicon.zip" class="btn btn-d btn-lg able-title-white me-lg-3 btn-style" target="_blank">SVG&nbsp;</a><a href="./" class="btn btn-d btn-lg able-title-white me-lg-3">Sketch Symbol</a><a href="downloads/xticon.iconjar.zip" class="btn btn-d btn-lg able-title-white me-lg-3" target="_blank">iconjar</a><a href="https://www.iconfont.cn/user/detail?spm=a313x.icontype_collection.i3.41.64d83a81VMn1cD&uid=18449&nid=uWAKzTZ5zyY9" class="btn btn-d btn-lg able-title-white me-lg-3" target="_blank">iconfont</a><a href="./" class="btn btn-d btn-lg able-title-white me-lg-3">Adobe illustrator</a><a href="./" class="btn btn-d btn-lg able-title-white">Figma</a>

					</div>

					<div class="col-lg-12 text-lg-center mt-lg-4">

						<a href="./xticon-license/" class="btn btn-d btn-lg magic "><span class="icon-spacer feather-icon icon-paper"></span>许可证<br></a><a href="#" class="btn btn-d btn-lg magic" data-bs-toggle="modal" data-bs-target="#contact"><span class="icon-spacer feather-icon icon-head"></span>联系我</a>

					</div>

					<div class="col">

						<div id="contact" class="modal fade" tabindex="-1" role="dialog">

							<div class="modal-dialog modal-sm modal-dialog-centered" role="document">

								<div class="modal-content">

									<div class="modal-body">

										<img src="img/lazyload-ph.png" data-src="img/contact.svg" class="img-fluid img-protected mx-auto d-block animated fadeIn animDelay04 lazyload" alt="contact" data-appear-anim-style="fadeIn" width="360" height="544">

									</div><a href="#" class="btn btn-lg btn-style-none btn-d mb-lg-2" data-bs-dismiss="modal" aria-label="Close"><span class="special-tag-for-editing-text-with-html"></span><span class="close feather-icon icon-cross"></span></a>

								</div>

							</div>

						</div>

					</div>

				</div>

			</div>

		</div>

	</div>

</div>

<!-- bloc-7 END -->



<!-- bloc-7 -->

<div class="bloc bgc-1966 none full-width-bloc d-bloc" id="bloc-7">

	<div class="container bloc-lg bloc-no-padding-lg">

		<div class="row pe-lg-5 ps-lg-5">

			<div class="col text-start pe-lg-0 ps-lg-0">

				<div class="divider-h divider-background-color">

				</div>

				<div class="row">

					<div class="col pe-lg-0 ps-lg-0">

						<p class="p-bloc-7-style">

							<strong>XTicon</strong>

						</p>

					</div>

					<div class="col pe-lg-0 ps-lg-0">

						<a href="https://youi.space" class="a-btn a-block text-lg-right footer-url" target="_blank">©2019-2023 / 作者：ZHANGXIN</a>

					</div>

				</div>

			</div>

		</div>

	</div>

</div>

<!-- bloc-7 END -->



<!-- ScrollToTop Button -->

<button aria-label="Scroll to top button" class="bloc-button btn btn-d scrollToTop" onclick="scrollToTarget('1',this)"><svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 32 32"><path class="scroll-to-top-btn-icon" d="M30,22.656l-14-13-14,13"/></svg></button>

<!-- ScrollToTop Button END-->





</div>

<!-- Main container END -->

    





<!-- Additional JS --><script src="./js/jquery.min.js"></script>





<script src="./js/bootstrap.bundle.min.js?8200"></script>

<script src="./js/blocs.min.js?8769"></script>

<script src="./js/lazysizes.min.js" defer></script>

<script src="./js/lottieplayer.js?2464"></script>

<!-- Additional JS END -->





</body>

</html>
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
HTML
1
https://gitee.com/ZHANGXIN090/xticon.git
git@gitee.com:ZHANGXIN090/xticon.git
ZHANGXIN090
xticon
XTicon 1300+图标库
master
点此查找更多帮助

搜索帮助

Git 命令在线学习 如何在 Gitee 导入 GitHub 仓库
Git 仓库基础操作
企业版和社区版功能对比
SSH 公钥设置
如何处理代码冲突
仓库体积过大，如何减小？
如何找回被删除的仓库数据
Gitee 产品配额说明
GitHub仓库快速导入Gitee及同步更新
什么是 Release（发行版）
将 PHP 项目自动发布到 packagist.org
评论
仓库举报
回到顶部