chakra ui
@chakra-ui
Chakra UI 是一個由可存取、可重複使用和可組合的 React 元件組成的綜合庫，可簡化現代 Web 應用程式和網站的開發。該庫提供了各種組件，可以輕鬆組合這些組件來建立複雜的使用者介面，同時遵循可訪問性最佳實踐。
create-react-app模板這是 Chakra UI 最新版本的 https://chakra-ui.com 網站。對於舊版本，請前往此處
Box和Stack ，可透過傳遞 props 輕鬆設定元件樣式。了解更多aria-*屬性。要使用 Chakra UI 元件，您需要做的就是安裝@chakra-ui/react套件及其對等依賴項：
# with Yarn
$ yarn add @chakra-ui/react @emotion/react
# with npm
$ npm i @chakra-ui/react @emotion/react
# with pnpm
$ pnpm add @chakra-ui/react @emotion/react
# with Bun
$ bun add @chakra-ui/react @emotion/react若要開始使用這些組件，請依照下列步驟操作：
ChakraProvider包裝您的應用程式。 import { ChakraProvider , defaultSystem } from "@chakra-ui/react"
// Do this at the root of your application
function App ( { children } ) {
return < ChakraProvider value = { defaultSystem } > { children } < / ChakraProvider >
}或者，您可以使用ColorModeProvider包裝您的應用程序，以便您可以在應用程式中在淺色和深色模式之間切換。
import { Button } from "@chakra-ui/react"
function Example ( ) {
return < Button > I just consumed some ⚡️Chakra! < / Button >
}有關如何開始的更多指南可在此處找到
create-react-app模板請參閱我們的指南，以了解如何使用我們的官方create-react-app範本的資訊。
想要貢獻嗎？太棒了！我們有一份貢獻指南來幫助指導您。
我們的文檔站點位於一個單獨的儲存庫中。如果您有興趣為文件做出貢獻，請查看文件網站貢獻指南。
與您的組織一起支持該專案。您的徽標將顯示在此處，並帶有指向您網站的連結。 [貢獻]
透過捐贈 5 美元或更多，您可以支持該專案的持續開發。我們將不勝感激一些支持。感謝我們所有的支持者！ [貢獻]
人們經常向我丟 React 元件庫和設計系統。這可能是我見過的最好的一個。 API 很簡單但可組合，而且我查看的幾個元件的可訪問性是完整的。
偉大的工作@thesegunadebayo，真正鼓舞人心的工作。 ——瑞安‧佛羅倫斯
來自 @thesegunadebayo 的很棒的新開源元件庫。真是令人印象深刻的東西！ ——科爾姆·圖伊特
這是一項令人難以置信的工作。 Segun 幹得很棒！ ——李‧羅賓遜
Chakra UI 太棒了！我喜歡一貫使用焦點造型和微妙的動畫 – Guillermo ▲
我們非常榮幸能夠因 Chakra UI 為 JavaScript 生態系統帶來的所有創新和影響力而獲得社群的獎項和提及。
值得追求的解決方案技術雷達（2020-2021） | |
對社區最具影響力的貢獻開源獎（2020 年） |
感謝這些優秀的人
塞貢·阿德巴約 ？ ？ | 蒂奧魯瓦尼·科拉沃勒 ？ | 德萬什·傑斯瑪拉尼 | 阿德里安·亞歷山德烈 | 李 | 克里斯托夫·波杜斯洛 ？ ？ | 賈斯汀·霍爾 |
馬克錢德勒 | 阿格巴耶福拉薩德 ？ | 克里斯蒂安·恩萬巴 | 喬納森·巴克布瓦 ？ | 亞歷克斯·梁 ？ | 傑斯科·武斯特 | 塵土飛揚的多麗絲 |
亞歷克斯·洛貝拉 | 托馬索·德羅西 | 奧迪 | 亨德里克·尼曼 | 馬特·羅滕伯格 | 路易斯·費利佩·扎吉尼 | 讓 |
特米托普·阿吉博耶 | 喬納森金 | 克里斯湯普森 | 沃爾特·基馬羅 | 傑克·萊斯利 | 肯-勞倫·達加尼奧 | 拉蒙 |
傑西 ？ | 艾勒貢·卡約德·邁克爾 | 塔爾威廉斯 | 崔佛布雷茲 ？ | 戈德李 | 阿格洛斯·阿爾瓦尼塔基斯 | 道格拉斯·加布里埃爾 |
馬丁諾德斯特倫 | 丹尼·塔托姆 | 西蒙‧柯林斯 | 桑蒂阿爾博 | PILO7980 | 石本浩二 | 傑夫溫 |
巴勃羅·賽斯 | 內吉·拉夫尼克 | 朱利安維亞拉 | 塞巴斯蒂安·特雷布納克 | 亞當普蘭特 | 盧西奧·魯本斯 | 賈森·米亞茲加 |
貢薩洛·波佐 | 基督教 ？ | 克里斯蒂安·哈根多恩 | 安德烈·克拉斯諾夫 | 多尼·蘇卡迪 | 猛 | 加布里埃萊·貝盧阿多 |
弗朗索瓦·貝斯特 | 何天慈 | 史蒂文 | 巴蒂斯特·阿德里安 | 羅布貝文 | 湯瑪斯 | 徐愷 |
大衛威佩爾 | 納文 | 文森 | 奧薩馬·奧爾多艾斯 | 弗雷德·K·肖特 | 賈里德·帕爾默 | 奧斯汀·瓦萊拉 |
東尼納洛克 | 托馬斯·馬克西米尼 | 大衛·鮑姆戈爾德 | 拉爾菲柳斯 | 拉胡爾·朗內卡 | 皮埃爾·內爾 | 皮埃爾·格里莫 |
威斯普研發 | 馬克納·斯穆茨 ？ | 納爾遜·賴茨 | 穆罕默德·奈納爾 | 穆斯塔法·圖爾汗 | 金·羅恩 | 麥家俊 |
傑里米·戴維斯 | 盧傑瑞 | 伊凡·達爾梅特 ？ | 狄龍·庫裡 | id函子 | 電氣街 | 亞倫亞當斯 |
阿卜杜拉齊茲·阿德什納 | 桑德羅 | 普雷姆庫瑪·尚穆根 | 托比亞斯·梅克斯納 | 傑里米·勒布朗 | 凱爾文·奧根納霍羅 | 大衛·J·菲利克斯 |
布羅迪·麥基 | 佩爾·斯文森 | 派崔克卡森 | 伊沃·伊利奇 | 阿瓦內什·特里帕蒂 | 巴利貝巴斯 | 納文穆迪 |
提姆金德伯格 | 碘達爾 | 模玉峰 | 彭傑 | 詹姆斯·吉 | 安東 | 達姆詹·盧科維奇 |
史丹尼拉·安德烈 | 埃庫諾拉·以西結 | 本‧米欽森 | 傑西·特爾福德 | 西莫·亞歷山德羅夫 | 埃里克勒斯·伊曼紐爾 | 科丁貓 |
山姆道森 ？ | hy2k | 皮埃爾·奧特加 | 凱雷姆·塞文坎 | 哈維哈爾文 | 曼蘇爾·本尤瑟夫 | 安德魯加里森 |
卡洛斯·羅德里格斯 | 德懷特·沃森 | 查辛色調 | 納韋爾‧格列柯 ？ ？ | 巴勃羅·羅查 | 達斯汀·拉里默 ？ | 胡利亞諾·法裡亞斯 |
喬貝爾 ？ | 亨寧·波爾邁爾 | 西維特·舒·奧爾森 | 安德烈·拉扎雷斯庫 | 何塞·特謝拉 ？ | 阿德里亞諾·雷森德 | 維克多·巴斯托斯 |
文森 | 坎蒂斯 ？ ？ | 戴夫鮑曼 | 提姆·柯爾伯格 ？ | 史蒂芬·門薩 ？ | 伊斯坎德布勒爾 | 多明尼克·蘇梅爾 |
帕維爾·斯特拉克·多萊切克 | 凱沙夫·博赫拉 | 奧凱濟厄克 | 克萊頓法利亞 | 安德魯·埃利斯 ？ | 喬爾·加蘭特 ？ | 賈亞·克里希納·南布魯 |
伊菲奧瑪·伊莫 | 賈森·阿德克森 ？ | 高蒂爾·羅達羅 ？ | 湯姆·多納爾 | 薩姆·瑪格利特 ？ | 馬庫斯·伍德 | 史賓塞·杜鮑爾 |
雅各·阿里奧拉 | 肯利·吉恩 | 丹尼斯·莫雷洛 ？ | 奧馬爾·戈拉 | Zyclotrop-j | 洪錫宇 | 楊俊浩 |
湯瑪斯·西勒 | 塞繆爾·考夫曼 | 約瑟夫·米庫拉斯 | 若昂·維克多 | 宮前雄一郎 | 吉法·埃里揚托 ？ | 愚子 |
松熙院 | 普拉薩納·文卡特什 TS | 安索姆 | 奧薩馬·阿赫馬羅 ？ | 達南·維賈亞 | 電石 ？ | 舒巴姆·考沙爾 |
彼得·薩瑟·摩恩 | 赫爾曼·尼加德 | 江南石化 | 穆罕默德·賽義德 | 薩姆·波德 | 多明尼克李 | 費拉斯·阿盧達 ？ |
JP翁加雷蒂 | 恩迪卡·因特克奧蒂塔 | 馬特威爾斯 | 阿南特·賈恩 | 湯姆陳 ？ | 厄尼·米蘭達 | 比約呂克 |
蘇吉特‧普拉丹 | 阿布舍克·卡什亞普 | 克里斯蒂安·賈科維奇 | 安東尼爾·馬加良斯 | 格里科·尼布拉斯 ？ | 馬爾伯特 | 姆查 |
哈西卜·哈桑 | 傑米·羅爾夫斯 ？ | 素拉比笈多 | 寧加羅 ？ | 莫內 | 韋德麥克丹尼爾 | 戈登·哥德巴赫 |
比什 | 阿米爾卡·穆尼奧斯 | 薩馬爾·莫漢 | 若昂·保羅·羅德里格斯 | 艾弗里·弗里曼 | 丹尼爾·舒爾茨 ？ ？ | 麥可·基爾巴恩 |
ngx編碼器 | 克里斯多福·吉爾特維特·塞爾貝克 | 約翰·埃勒斯 | 盧卡斯·巴赫 | 拉扎爾·尼科洛夫 ？ | 岩田 ？ | 李承燦 |
pomSense | 學生 | 板倉龍也 ？ | 小谷由久 ？ | 瓦迪姆·德梅德斯 |
（表情符號鍵）：
該項目遵循所有貢獻者規範。歡迎任何形式的貢獻！
麻省理工學院 © Segun Adebayo
