寫在前面
本文適合從事企業中後臺系統設計或者對這方面感興趣的設計師，以及在做前端元件化的開發小夥伴閱讀。給大家整理了一些Sketch UI Kit連結放在文末，作為小福利送給大家，感興趣的可以下載研究～
筆者近期在從事企業級中後臺產品的元件化設計，為了更好的開展工作，做了一些關於元件化和設計系統的市場調查，過程中收集了一些競品。現在把收集到的這些產品分享出來，目前不做深度分析和評價，對這方面感興趣的小夥伴可以另行研究或者新增本人微信（WeChat ID:627270092），相互交流學習。後面我也會結合自己的實際工作對於如何從0開始做一套Design System做一些技術和方法論的分享。
下面給大家分享13個關於前端設計系統的網站，開發框架涉及React、Vue、Angular、Bootstrap , 移動端和web端元件庫都有。
01 Ant Design 螞蟻出品
最近風頭正火的螞蟻金服在2018年年初更新的 Ant Design 3.0 , 基於Atomic Design思想打造的面向行業提供解決方案的設計系統，相信已經有跟多前端小夥伴已經嚐到了使用這套系統的甜頭。
官方提供的設計資源 Ant.Design.3.0.Components.sketch 密碼:yn5f
02 iView TalkingData的Aresn出品
Aresn的這套基於 Vue.js 的開源 UI 元件庫可以說是在Ant Design官方推出Vue實現之前對其實現方式的補充，當然現在螞蟻已經自己也實現了Vue版。但這並不妨礙iView的繼續發展。
無相關設計資源可供下載
03 Zan UI 有贊出品
Zent ( \ˈzent\ ) 是有贊 PC 端 WebUI 規範的 React 實現，提供了一整套基礎的 UI 元件以及一些常用的業務元件。目前我們有 50+ 元件，這些元件都已經在有讚的各類 PC 業務中使用，我們會在此基礎上，持續開發一些新元件。
無相關設計資源可供下載
Vant是一套輕量、可靠的移動端 Vue 元件庫。 具有以下特性：1.50+ 個經過有贊線上業務檢驗的元件；
2.單元測試覆蓋率超過 90%；
3.完善的文件和示例；
4.支援 babel-plugin-import；
5.支援 TypeScript；
6，支援 SSR；
04 Cube UI 滴滴出品
滴滴的移動元件庫，具有明顯的滴滴風格。感興趣的可以研究。
無相關設計資源可供下載
05 Element 餓了麼出品
官方提供的設計資源 Element UI Kit_v2.0.sketch 密碼:plnx
06 SHINEOUT
官方實現：React ，支援web端
07 飛冰 阿里出品
官方實現：React，支援web端
飛冰是一套基於 React 的中後臺應用解決方案，在阿里巴巴內部，已經有 270 多個來自幾乎所有 BU 的專案在使用。經過 2 年的發展，飛冰已經是中後臺 2.0 體系，這個階段中我們的目標是賦能企業、組織搭建自己的中後臺體系。飛冰包含了一條從設計端到開發端的完整鏈路，幫助我們的使用者快速搭建屬於自己的中後臺應用。
08 RSUITE
09 袋鼠UI 美團外賣出品
KangarooUI(又稱袋鼠UI) 是美團外賣元件生態平臺構建的基石，服務於提供標準化規範化的元件。當前推出的版本基於 Bootstrap 3.3.7 進行擴充套件，後續會持續推出Vue等版本。由於目前大部分業務線是jQuery和requireJs來進行開發的，所以引入袋鼠UI時，需要先引入jQuery(1.11.1以上版本)。另外需要特別注意的是袋鼠UI在1.0向2.0更新之後，所有 擴充套件元件 都必須通過 Kangaroo-Loader 進行載入。
10 Muse UI
基於 Vue 2.0 優雅的 Material Design UI 元件庫。Muse UI 擁有40多個UI 元件，用於適應不同業務環境。Muse UI 自定義主題方式極為優雅，僅需少量程式碼即可完成主題樣式替換。
11 CARBON IBM出品
官方實現：React、Angular ，支援web端
官方提供的設計資源 Carbon Design Kit.sketch 密碼:yyjj
12 Blueprint Palantir出品
官方實現：React ，支援web端
13 LIGHTNING Salesforce出品
官方實現：未知 ，支援web端和移動端
官方提供的設計資源 SLDS Component Library.sketch 密碼:frba
福利
筆者收集整理的一些關於搭建一套設計系統的元件庫參考 設計資源大禮包 密碼:46rq，歡迎下載～
下面是筆者個人微信，歡迎??掃碼來撩～
謝謝閱讀！希望讀完能對你有一點幫忙～