![Adam Wathan](/img/default-banner.jpg)
- 124
- 1 941 997
Adam Wathan
Приєднався 31 гру 2014
Designing with Tailwind CSS: Styling a Dropdown Menu
Designing with Tailwind CSS: Styling a Dropdown Menu
Переглядів: 55 292
Відео
Designing with Tailwind CSS: Making the Dropdown Interactive
Переглядів 28 тис.4 роки тому
Designing with Tailwind CSS: Making the Dropdown Interactive
Designing with Tailwind CSS: Positioning the Dropdown Area
Переглядів 21 тис.4 роки тому
Designing with Tailwind CSS: Positioning the Dropdown Area
Designing with Tailwind CSS: Adapting the Dropdown for Mobile
Переглядів 16 тис.4 роки тому
Designing with Tailwind CSS: Adapting the Dropdown for Mobile
Designing with Tailwind CSS: Making the Navbar Responsive
Переглядів 26 тис.4 роки тому
Designing with Tailwind CSS: Making the Navbar Responsive
Designing with Tailwind CSS: Building a Navbar Layout with Flexbox
Переглядів 35 тис.4 роки тому
Designing with Tailwind CSS: Building a Navbar Layout with Flexbox
Designing with Tailwind CSS: Toggling the Navbar Links on Mobile
Переглядів 30 тис.4 роки тому
Designing with Tailwind CSS: Toggling the Navbar Links on Mobile
Designing with Tailwind CSS: Hover, Focus, and Active Styles
Переглядів 25 тис.4 роки тому
Designing with Tailwind CSS: Hover, Focus, and Active Styles
Designing with Tailwind CSS: Composing Utilities with @apply
Переглядів 24 тис.4 роки тому
Designing with Tailwind CSS: Composing Utilities with @apply
Designing with Tailwind CSS: Locking an Image to a Fixed Aspect Ratio
Переглядів 23 тис.4 роки тому
Designing with Tailwind CSS: Locking an Image to a Fixed Aspect Ratio
Designing with Tailwind CSS: Designing a Badge
Переглядів 11 тис.4 роки тому
Designing with Tailwind CSS: Designing a Badge
Designing with Tailwind CSS: Responsive Design
Переглядів 41 тис.4 роки тому
Designing with Tailwind CSS: Responsive Design
Designing with Tailwind CSS: Making Text Content Feel Designed
Переглядів 15 тис.4 роки тому
Designing with Tailwind CSS: Making Text Content Feel Designed
Designing with Tailwind CSS: Setting up Tailwind and PostCSS
Переглядів 115 тис.4 роки тому
Designing with Tailwind CSS: Setting up Tailwind and PostCSS
Designing with Tailwind CSS: Customizing Your Design System
Переглядів 22 тис.4 роки тому
Designing with Tailwind CSS: Customizing Your Design System
Designing with Tailwind CSS: Creating Depth with Shadows and Layers
Переглядів 12 тис.4 роки тому
Designing with Tailwind CSS: Creating Depth with Shadows and Layers
Designing with Tailwind CSS: Cropping and Positioning Images
Переглядів 28 тис.4 роки тому
Designing with Tailwind CSS: Cropping and Positioning Images
Designing with Tailwind CSS: Optimizing for Production with Purgecss
Переглядів 19 тис.4 роки тому
Designing with Tailwind CSS: Optimizing for Production with Purgecss
Designing with Tailwind CSS: The Utility-First Workflow
Переглядів 40 тис.4 роки тому
Designing with Tailwind CSS: The Utility-First Workflow
Designing with Tailwind CSS: Working with SVG Icons
Переглядів 29 тис.4 роки тому
Designing with Tailwind CSS: Working with SVG Icons
Designing with Tailwind CSS: Extracting Reusable Components
Переглядів 23 тис.4 роки тому
Designing with Tailwind CSS: Extracting Reusable Components
Designing with Tailwind CSS: Structuring a Basic Card
Переглядів 17 тис.4 роки тому
Designing with Tailwind CSS: Structuring a Basic Card
Why you don't need BEM with utility-first CSS
Переглядів 19 тис.4 роки тому
Why you don't need BEM with utility-first CSS
My Podcast Editing Workflow with REAPER
Переглядів 8 тис.5 років тому
My Podcast Editing Workflow with REAPER
"Test-Driven Laravel" - Adam Wathan - Laracon US 2016
Переглядів 17 тис.5 років тому
"Test-Driven Laravel" - Adam Wathan - Laracon US 2016
"Resisting Complexity" - Adam Wathan - Laracon US 2018
Переглядів 25 тис.5 років тому
"Resisting Complexity" - Adam Wathan - Laracon US 2018
Pairing with Ben Orenstein on the Tuple Pairing Guide (using Tuple!)
Переглядів 7 тис.5 років тому
Pairing with Ben Orenstein on the Tuple Pairing Guide (using Tuple!)
The Trick to Understanding Scoped Slots in Vue.js
Переглядів 54 тис.6 років тому
The Trick to Understanding Scoped Slots in Vue.js
"Cruddy by Design" - Adam Wathan - Laracon US 2017
Переглядів 79 тис.6 років тому
"Cruddy by Design" - Adam Wathan - Laracon US 2017
Building KiteTail #1: Previewing Image Uploads with Vue.js
Переглядів 16 тис.7 років тому
Building KiteTail #1: Previewing Image Uploads with Vue.js
Whats the plugin you use it for look the preview?
please upload source code, it is nice to read your code.
this man is underrated, I like your way of explanation and how do you go through details, thanks a lot
This is coding ASMR at it's best. :D
I really like that approach, that you actually use Tailwind to get the user experience.
Your reaction when you realized the tracking for the hero text was mixed had me rolling🤣😅😂😂. Great video.
As a late adopter of Tailwind CSS, it's great to see how the creator of the tool himself goes through the building process. I really hate it when designers do these kind of per letter tweaks in the design. I know frontend dev should have attention to detail but come on man... 🤪🤪 Thanks for sharing that @AdamWathan
Is there a final code repo for this?
Glad to see new streams! Will try out brave instead of chrome, could be better
Upload more videos
I was really hoping this would be a video about designing a kanban board. I've done some in the past and they're a lot trickier than they seem. I'd love to see your approach.
Please, Adam, what plugin are you using to pull up the tailwind colors?
Html semantics dude
@26:43 for the semantic part put the h3 n p in a hgroup and the order in thr hgroup does not matter.
Hey, anyone knows what is is the extension of raycast that he is using for previewing the tailwindcss classes? thanks!
I need that as well
Hey Adam, when is tailwind going to share the new vscode theme? It looks awesome. Thanks
Anyone know the name of that app he’s using to look up things in the Tailwind docs? Nifty
It's a Raycast extension for Tailwind. I'd link it, but YT tends to block comments with links in them.
Thanks!
@19:55 do you think if you create the card as a children of the gradient DIV then give them a negative translate-y would be a better idea ?
Great video! One question, why not use Dev Mode of Figma? Quite helpful getting sizing/paddings and the measuring tool
I missed it :(
Nice video
I don’t know if you’ll see this but I remember you mentioned doing paired programming streams where you can work live with someone - there is a VS Code extension called Live Share which allows you to work on code with others in real time like a google doc document! I think the content would be amazing (it already is😄)!! Would love to see you try that out, it sounds very interesting and something that no one really does on youtube!
Can I ask what is the tool ur using on 10:05? Its really helpful for beginners like me.
Looks like Raycast with tailwind extemsion
@@rajshekhardev thanks! is it only available on mac?
@@sebin_01 yes
Which builder are you using? Please
what do you mean?
Couldn't you have used text-[64px] to get the font size desired?
im new on tailwind. IS this a native syntax for tailwind to get the exact size of a font?
You should almost never use px for typography unless declaring base sizes because rem and em scales but px don't.
Somebody's been working on putting the content out! 😉
He is the founder of TAILWIND.css xD
Awesome! What is that command palette where you search for the colors?
Is the Figma file available to download?
Please, more content like this!!!
The Maestro Behind Tailwind css, its always great to watch the creator. Keep up the great job
Hey Adam, hate to be the person that of all things to ask about is asking about your theme... but; that Tailwind CSS style VS Code theme you're using... will that become available? 👀
Was mentioned in the video by Adam at @37:48; it's not ready yet to be released, might be - someday.
Nice video
inspiring!
BOSS IS HERE
If you do make the Raycast extensions available that would be awesome. I can already see how that would be useful.
awesome 1080p
Sorry to be a Richard, but it's pretty irritating to hear you speak about non-project related stuff like Pepsi or family. Stick to the job
It was Coke actually get it straight.
Wow. What an idiotic comment.
Please is the source code open source ?
@yadusolparterre hard disagree. Just skip ahead if it annoys you.
Is tailwind color Ray extension private? It's a dope. 😉
Not trolling or anything, just actually curious, but does this project have a functional justification to use Next.js/TS/Tailwind or it is just an opportunity to demonstrate development process using JS stack? The page looks fairly static, seems like HTML/CSS would be enough. Great video nonetheless!
The logo bit was so interesting to me.
Instead of doing arithmetic translating pixels from Figma, you could build a new design editor just for Tailwind - Tailwind Designer. 😅
Oh i have something wonderful to share with you. Let me know of your twitter/email and I can share what I have been working on
thats cooool man keep going
Really enjoyed this stream, looking forward to more!
Is it possible to get the figma to code along?
Lets go we need more of this
Awesome Adam, love watching your streams.
AYYYYYYYYYYYYYYYYYYY ! Adam back to bussiness 😇😇😇😇
yoo mother fucker what the fuck was that? what the fuck kind of explanation was that bitch.
This! No more 10-20 action controllers!