Hey all, thank you for tuning in on this video! If you want to follow along the design example in the video, head over to the video description and duplicate the Chakra UI kit file. I'll be updating it regularly, as I'll be reusing these styles and components in future videos as we begin to close the gap with production-level design and bringing things into code. I hope that you've found this video interesting, and if you have any thoughts feel free to drop them in the comments!
Awesome ! Very good example of optimised design for coding. I also really like that you show/share every bit of your file and explain the whys (spacing, large vs small screen). This is a very usefull and pratical exemple of best practice. Very well done!
Thanks for this! I'm curious about the process of "getting this into code"… you do mention that the devs/eng can get what they need from this to implement it on their end. How? What are they looking at specifically? I am guessing they still need to code up all the underlying components and then hmmm is it the "Component Properties" in the Inspector which they use (copy/paste or type) in the code? thanks!
I personally love both for different reasons. Chakra has some good comparison notes in their documentation here: chakra-ui.com/docs/comparison If you want to sweat the design details, you'll enjoy Tailwind a lot. If you're not interested in styling too much and want out of the box components, Chakra overdelivers.
![[Chakra-ui] Customise your theme and components](http://i.ytimg.com/vi/1J8dUyeUWO4/mqdefault.jpg)
Hey all, thank you for tuning in on this video! If you want to follow along the design example in the video, head over to the video description and duplicate the Chakra UI kit file. I'll be updating it regularly, as I'll be reusing these styles and components in future videos as we begin to close the gap with production-level design and bringing things into code. I hope that you've found this video interesting, and if you have any thoughts feel free to drop them in the comments!
Cool!
You are the dream of every engineer haha.
True. Imagine your designer referring the UI framework you use before designing!
This is an awesome video, Javier! The Chakra community needs something like this in Figma that's maintained.
Thank you, happy to hear that you found it useful! There's more to come.
Thanks for sharing the tip with the spacing!
Awesome ! Very good example of optimised design for coding. I also really like that you show/share every bit of your file and explain the whys (spacing, large vs small screen). This is a very usefull and pratical exemple of best practice. Very well done!
Thank you, much appreciated :) I’m happy to hear it was helpful!
Awesome work friend, thank you sooo much!! This is professional!!!
Thank you Javier... this is just the best design system that i ever saw. Cheers!
Thanks for your comment Bruno!
Awesome content. Really helped me. Thanks!
Aweomse Javier! That's so helpful for my work right now.
Thanks Daniel! Happy to hear it's helpful 🙏
Great video!
Thank you very much for this tutorials and for the figma project.
My pleasure!
Super useful - thanks for sharing!
My pleasure!
Amazing. Thanks Javier 👍
This is amazing, thanks so much for sharing this Javier,!
Thank you dude!
My pleasure, I hope it was helpful!
Thank you for this tutorial!
Thanks for this! I'm curious about the process of "getting this into code"… you do mention that the devs/eng can get what they need from this to implement it on their end. How? What are they looking at specifically? I am guessing they still need to code up all the underlying components and then hmmm is it the "Component Properties" in the Inspector which they use (copy/paste or type) in the code? thanks!
Good question. This needs to be answered Javier. :)
Awesome mate
Thanks so much, this is cool!
What's your opinion on Chakra compared to Tailwind? I'm having trouble deciding which one to use for a project 😥
I personally love both for different reasons. Chakra has some good comparison notes in their documentation here: chakra-ui.com/docs/comparison
If you want to sweat the design details, you'll enjoy Tailwind a lot. If you're not interested in styling too much and want out of the box components, Chakra overdelivers.
thanks, man!
You're welcome!
Awesome!
Thanks
It's got everything you need. Except for a frigging Stepper that I need so bad
Thank you foe suck a great content
My pleasure, thank you for watching!
chakra ui sucks