diff --git a/content/roadmaps/100-frontend/content/114-css-frameworks/114-js-first/101-chakra-ui.md b/content/roadmaps/100-frontend/content/114-css-frameworks/114-js-first/101-chakra-ui.md
index 472306399..733a58063 100644
--- a/content/roadmaps/100-frontend/content/114-css-frameworks/114-js-first/101-chakra-ui.md
+++ b/content/roadmaps/100-frontend/content/114-css-frameworks/114-js-first/101-chakra-ui.md
@@ -1 +1,12 @@
-# Chakra ui
\ No newline at end of file
+# Chakra UI
+
+Chakra UI is a simple, modular and accessible component library that gives you the building blocks you need to build your React applications.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Website' href='https://chakra-ui.com/'>Chakra UI Website</BadgeLink>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://chakra-ui.com/docs/getting-started'>Chakra UI Official Getting Started</BadgeLink>
+<BadgeLink badgeText='Course' colorScheme='green' href='https://egghead.io/courses/build-a-modern-user-interface-with-chakra-ui-fac68106'>Build a Modern User Interface with Chakra UI</BadgeLink>
+<BadgeLink badgeText='Course' colorScheme='green' href=''></BadgeLink>
+<BadgeLink badgeText='Watch' href='https://youtu.be/wI2vqXsjsIo'>Official Getting Started Video</BadgeLink>
+<BadgeLink badgeText='Watch' href='https://youtu.be/s-bIsz-NR3c'>Chakra UI Crash Course</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.freecodecamp.org/news/why-should-you-start-using-chakraui/'>Why You Should Start Using Chakra UI</BadgeLink>