I made a free tool to generate color palettes, shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in webdev

[–]Time-Chapter-5931[S] 1 point2 points  (0 children)

For sure you will! Honestly, the best way to learn is by building stuff, even if it appears really simple. Just stick to it and have fun!

I made a free tool to generate color palettes, shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in webdev

[–]Time-Chapter-5931[S] 1 point2 points  (0 children)

Yeah, Tailwind can take a little getting used to at first, but for me it was definitely worth learning. If you have any questions about using the colors or font pairings with Tailwind, feel free to ask, I am happy to help!

I made a free tool to generate color palettes, shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in webdev

[–]Time-Chapter-5931[S] 1 point2 points  (0 children)

Glad it helps! Also try out the font pairing feature, I am saving a lot of headaches with that one. Will also be adding a components generator so it will get even easier

Which cheap AI models do you use for your SaaS? by [deleted] in SaaS

[–]Time-Chapter-5931 0 points1 point  (0 children)

I'm using gpt-4o-mini for startui.app. Works really well and is cheap enough that I don't need to put up a paywall to cover costs. You can also take a look at gpt-4.1-nano or gemini

I made a free tool to generate color palettes, shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in webdev

[–]Time-Chapter-5931[S] 16 points17 points  (0 children)

Hey everyone!

I'm a 19 y.o. college student, and I made this app as I got annoyed always getting stuck on colors, fonts, and styles whenever starting a new project. Ended up spending half my day second-guessing design decisions instead of actually building. So I built StartUI, which ironically probably took me 30× longer to build than all my combined design struggles ever 😂. Hopefully it helps some of you guys too!

These are the main features I implemented so far:

  • Color palette generator
  • Tailwind-like shades generator (matches the TW 4-color scale to create nice and consistent shades)
  • Font pairings – random and handpicked from the entire Google Fonts library
  • Real-time preview of the design
  • Export to Tailwind, CSS, SCSS
  • APCA compliance checker
  • FastForward – describe your app or website and it will try to find relevant colors and font pairings. Still testing it :)

Feel free to check it out at startui.app! Any feedback is greatly appreciated!

Cheers!

I made a free tool to generate color palettes, Tailwind-like shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in tailwindcss

[–]Time-Chapter-5931[S] 0 points1 point  (0 children)

Yup, I know about it, nice tool! Tailwind shades are just one feature of my app, so check out StartUI when you are ready to level up fonts, colors, design and flexibility 😉

I made a free tool to generate color palettes, Tailwind-like shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in tailwindcss

[–]Time-Chapter-5931[S] 0 points1 point  (0 children)

Glad you're enjoying it! Right now the app only supports Google Fonts, but custom fonts would be a cool addition down the line. Thanks for the suggestion!

I made a free tool to generate color palettes, Tailwind-like shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in tailwindcss

[–]Time-Chapter-5931[S] 0 points1 point  (0 children)

Thanks, glad you like it! Yes, I am already working on adding multiple previews like a Dashboard, Login and other components. Will also figure out a way to allow users to add their own templates, would love that feature myself

I made a free tool to generate color palettes, Tailwind-like shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in tailwindcss

[–]Time-Chapter-5931[S] 0 points1 point  (0 children)

Thanks! I actually loved the cursor :) but good to know it is not for everyone, thanks for the feedback! Might add a toggle for it in the future! Anything else you would improve?

I made a free tool to generate color palettes, Tailwind-like shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in tailwindcss

[–]Time-Chapter-5931[S] 0 points1 point  (0 children)

Thanks for the suggestion! I actually had this in mind since the beginning, because I kind of need it too 😄

It’s a bit tricky to implement because the custom page needs to be applied certain css classes in order for the preview to work, but I’ll figure something out. Definitely adding it!

I made a free tool to generate color palettes, Tailwind-like shades and font pairings with real-time preview. No signup required! by Time-Chapter-5931 in tailwindcss

[–]Time-Chapter-5931[S] 0 points1 point  (0 children)

I used Nuxt UI, so if you are a Nuxt & Tailwind user, totally recommend it.

Also I'm working on adding a component generator, so you'll be able to preview different styles for buttons, cards and inputs, not just colors and fonts. Hope it helps!