Forem: Priyank Deep Singh

Say Hello to Colorbrew’s New AI Palette

Priyank Deep Singh — Mon, 19 May 2025 05:35:16 +0000

Hey! 👋

So... I built this thing. And it's kinda cool (not trying to brag but… okay maybe just a little 😎).

Try: https://www.colorbrew.co/ai-palette

I just added a brand new AI Palette feature to Colorbrew.co — a simple lil’ tool where you type a few words like “sunset on a beach” or “Dragon Ball Z fight scene colors" and it spits out 5 awesome color palettes that actually make sense. Wild, right?

But wait. Lemme slow down and explain this like I’m telling my 5-year-old cousin who thinks blue is the only color that exists.

🎯 What's the Point of This?
Okay, imagine you're designing a website. Or painting something. Or even picking out your wedding theme (don’t ask how I know 😅). You’ve got a vibe in mind, but no idea how to turn that vibe into actual colors.

So instead of scrolling through Pinterest for 45 minutes and still being confused...

👉 Just describe it in words.

Like seriously, just type:

“A cold foggy forest in the morning”

...and BAM 💥 you get a ready-to-use palette.

🧪 How It Works (Not Gonna Get Nerdy, Promise)

You type a sentence.

“Cyberpunk neon city lights”
“Sunset over Tokyo skyline”
“Old 90s cartoon color vibes”

And Colorbrew’s lil’ color brain thinks really hard 🧠 and gives you 5 color swatches that match your words. It’s like telling a friend what you want, and they go, “Gotchu fam.”

Then, you get options to:

Copy the HEX codes

Get the CSS code with those colors

Get both linear and radial gradients with your palette
(Yes, you can copy those directly too. Because we love lazy efficiency here 💅)

⚙️ The Control Room: Dial Your Vibe
Now here’s the spicy part 🌶️ — the Control Section.

You can tweak your color results with:

🌈 Saturation – make your colors pop or keep 'em chill

💡 Brightness – go dark mode or blast the sun

🔥 Warmth – go icy cold or toasty warm

It’s like a color mood swing dial. Very dramatic. Very fun.

🧑‍🎨 Who’s It For?
Web designers who are tired of boring default colors

Artists who need quick inspo

Indie devs who want to level up their UI game

Literally anyone who has ever opened Canva and gone, “Ugh what color goes with mustard yellow?”

Basically… if you’ve got vibes, we’ve got colors.

🐣 Examples to Try (Because I Know You wll Ask)
Try typing these on colorbrew.co/ai-palette:

Autumn forest in morning mist

Dune’s desert landscape

Dragon Ball Z fight colors

Futuristic Tokyo street market

Pastel clouds with vaporwave touch

You’ll see magic. Promise. ✨

🚀 Try It Now
No login. No weird popup. No guilt trip emails.
Just go here → colorbrew.co/ai-palette

Type your vibe. Get your palette. Copy the CSS. Make cool stuff.

*Go go go! *🏃‍♂️🎨💻

✌️ Final Words (Cuz I Gotta Wrap This Somehow)
Color is emotion. And with Colorbrew’s new AI Palette tool, you don’t need to be a color expert or a fancy designer. You just need a few words and a vision.

I made this because I always found color picking hard. Now I don’t.
So if you ever sit there, stuck thinking, “Uhh... what color is ‘epic medieval fantasy war’?” — Colorbrew's got your back 😎

Try it. Break it. Love it.
And tell me what wild color prompts you come up with! I am dying to see what weird color worlds you people imagine.

Stay colorful,
Adios!

ColorBrew Is Growing: New Features, New Adventures!

Priyank Deep Singh — Wed, 09 Apr 2025 05:53:27 +0000

Hey there, Dev.to!

It feels like just yesterday I was nervously hitting "Publish" on my very first blog post, announcing ColorBrew. I remember the butterflies in my stomach as I wondered: Will anyone actually use this?

Well, fast-forward to today, and I am still in awe at how much love ColorBrew has received. Your feedback has been my fuel, and your support has been my inspiration. If you missed the original post, you can still check it out here: Launching my project for Designer, Devs and Artist - ColorBrew.

But this isn’t just a trip down memory lane—ColorBrew has evolved into something so much bigger, and I’m thrilled to share all the new updates with you!

1. Gradient Generator
When I first started ColorBrew, my goal was simple: help people find beautiful color palettes. But as I explored new ways to make the tool more creative, I realized we needed gradients! Now you can seamlessly generate and customize gradients to your heart’s content.

Why gradients?
Gradients can add depth and style to websites, apps, and even print materials. With ColorBrew, you can:

Easily select two or more colors.
Tweak angles and transitions.
Copy or export the gradient in CSS or an image format.

No more fiddling with a million tools or guessing hex codes. It’s just a couple of clicks and boom—you’ve got a gorgeous gradient ready to go.

Try the Gradient Generator

2. Check Contrast For Accessibility
I believe design is for everyone. So, the next step was to include a contrast checker feature. No more crossing your fingers and hoping your text is readable. You can directly test color pairs for accessibility compliance (like WCAG AA or AAA standards).

Simply select your foreground color and background color.
Instantly see if it meets accessibility guidelines.
Adjust on the fly.

Creating inclusive designs shouldn’t be complicated—and now it isn’t!

Try the Contrast Checker

3. A New UI That Feels Like Home
We have tidied up the interface to make ColorBrew feel simpler and friendlier. Every menu and button is designed to be intuitive:

Less clutter, more focus – I’ve removed unnecessary elements to keep you in your creative flow.
Better organization – Features like the gradient generator, contrast checker, and curated palettes are just a single click away.
Faster performance – Because waiting is never fun!

It’s all about creating a place where you can experiment with color and feel at ease while doing it.

4. “Contact Us” for Real-Time Feedback
Ever had a question or a burning feature request? You can now reach out via the Contact Us page. I read every single message, and your thoughts shape the future of ColorBrew. Whether it’s a UI tweak or a brand-new function you’d love to see, drop a note—I’m all ears!

Checkout Contact Us Page

5. Chrome Extension
Yes, that’s right—a Chrome Extension!

Quick Access: No more typing in the URL.

Inspiration On The Go: Grab color palettes straight from the webpage you’re viewing.

Time-Saver: Generate gradients or check contrast without leaving your current tab.

I am personally super excited about this one because it makes brainstorming color ideas feel effortless.

6. Curated Palettes
If you’re looking for instant inspiration, the Curated Palettes section is a treasure chest. Sometimes, we just want a ready-to-use palette that looks stunning. Whether it’s trendy pastel vibes or bold neon statements, these curated sets cover a variety of moods and themes.

Because who doesn’t love an inspiring starting point?

Try the Curated Palettes

Looking Ahead
At this point, ColorBrew feels like my baby that’s learning to walk—and I can’t wait to see it run! I’m actively adding more features and making improvements every day:

More advanced gradient options?

Collaboration tools for teams?

Integrations with Figma or other design platforms?

The sky’s the limit, and I’d love to hear your thoughts on what’s next.

Gratitude & A Big Thank You!
I want to give a massive shoutout to everyone who has used ColorBrew, shared feedback, or given me a virtual high-five on social media. You’ve given me the courage to keep building, experimenting, and dreaming bigger.

So, if you haven’t already, check out ColorBrew and see what all the fuss is about. And please do reach out via our brand-new Contact Us page if there’s anything you’d love to see in future updates.

From the bottom of my heart, thank you. ColorBrew wouldn’t be where it is without you. Let’s keep making the web (and our designs) more colorful, one palette at a time.

Until next time,
Happy Color Brewing!

—
P.S.: If you do something cool with the new features, tag me or drop me a line. I’d love to see what you create!

The 5 Best Design Tools in 2024⚡️

Priyank Deep Singh — Tue, 29 Oct 2024 05:55:53 +0000

Are you staring at your screen, sipping your third cup of coffee, and still can't decide on the perfect color scheme for your next masterpiece? Fret not, design enthusiasts and creative wizards! We've scoured the web to bring you the 5 Best Color Palette Generator Websites that will transform your creative chaos into harmonious hues. And guess what? We have crowned Colorbrew as the reigning champion. Let’s dive into the colorful world of palette generators that are as fun as they are functional!

1. Colorbrew – Brewing the Perfect Palette Top Spot: Colorbrew

Link: colorbrew.co

Why is Colorbrew at the top, you ask? Well, imagine a brewery where instead of beer, you're crafting stunning color palettes. That's Colorbrew for you! Whether you're designing a website, sprucing up your Instagram feed, or painting your living room (hey, no judgments), Colorbrew offers a robust set of tools to brew the perfect colors.

Key Features:
Create Aesthetic Colors: Whether you’re into pastel vibes or bold statements, Colorbrew helps you concoct the perfect hues.
Gradient Palette: Smooth transitions? Yes, please! Create stunning gradients that make your designs pop.
Curated Themes: Not sure where to start? Choose from a variety of hand-picked themes tailored to different moods and styles.
Create Palette from Hex: Got a favorite hex code? Turn it into a full-blown palette with ease.
Save, Copy, Download: Don’t lose your masterpieces! Save your palettes, copy the codes, or download them for later use.

2. Color My Space: Paint Your Digital Canvas
Link: mycolor.space

If Colorbrew is your potion, Color My Space is your paintbrush. Perfect for interior designers and digital artists alike, this tool helps you visualize color schemes that make any space (real or virtual) look stunning.

Highlights:
Room Visualization: See your color choices in a simulated space before committing.
Extensive Color Library: From earthy tones to vibrant splashes, explore thousands of colors.
User-Friendly Interface: Even your grandma could design a masterpiece with this easy-to-use tool.
Custom Palette Creation: Mix and match to create a palette that’s uniquely yours.
Turn your color chaos into a harmonious masterpiece with Color My Space. Because who doesn’t want their digital or physical space to look Pinterest-perfect?

3. Muzli Colors: The Trendsetter’s Choice
Link: colors.muz.li

For those who like to stay ahead of the curve, Muzli Colors is your go-to generator. Packed with the latest trends and innovative features, it ensures your palettes are always in vogue.

Standout Features:
Trend Integration: Stay updated with the latest color trends straight from the design world.
Inspiration Boards: Curate your favorite palettes and get inspired by others’ creations.
Collaboration Tools: Team up with fellow designers and create palettes together.
Dynamic Color Adjustments: Easily tweak colors to fit your exact needs.
Muzli Colors is like that trendy friend who always knows what’s cool. With this tool, your designs will never be yesterday’s news.

4. Adobe Color: The Industry Standard
Link: color.adobe.com

When it comes to color palette generators, Adobe Color stands tall as the industry standard. Trusted by professionals worldwide, it offers a robust set of tools that cater to both beginners and seasoned designers.

Key Features:
Color Wheel: Dive deep into color theory with the interactive color wheel.
Customizable Themes: Create and save themes that align with your project’s vision.
Integration with Adobe Suite: Seamlessly use your palettes across Adobe’s suite of tools like Photoshop and Illustrator.
Community Gallery: Browse thousands of palettes created by other users for inspiration.
Adobe Color isn’t just a tool; it’s a design powerhouse. If you’re serious about color, this is your playground.

5. Colorhunt: Discover and Share Colors
Link: colorhunt.co

Last but certainly not least, Colorhunt is the perfect platform for discovering fresh and exciting color palettes. Whether you’re looking for minimalist schemes or vibrant combinations, Colorhunt has something for every taste.

Features:
Curated Collections: Handpicked palettes that cater to various design needs.
Search Functionality: Find exactly what you’re looking for with easy search options.
User Submissions: Share your own palettes and get feedback from a vibrant community.
Trending Palettes: Stay updated with what’s popular in the design world.
Colorhunt is like a treasure chest of colors waiting to be discovered. Dive in and find the perfect palette that makes your project shine.

Wrapping It Up: Choose Your Palette Adventure
Choosing the right color palette can make or break your design, but with these top 5 color palette generator websites, you’re well-equipped to create stunning visuals that captivate and inspire. From the versatile Colorbrew to the community-driven Colorhunt, each tool offers unique features that cater to different needs and styles.

So, next time you’re staring at a blank canvas wondering where to start, remember these color wizards are just a click away. Happy designing!

Launching my project for Designer, Devs and Artist - ColorBrew

Priyank Deep Singh — Tue, 15 Oct 2024 15:24:52 +0000

Hey everyone!

Time for some personal project I have been working on (well... technically, completed two years ago but never deployed 🙃). Meet ColorBrew—my fun little color palette generator website! And yes, the domain is live at ColorBrew. I finally made it off and decided to bring it to the world with a refreshed UI and some cool new features in the works.

But first, let me talk about the present: What can ColorBrew do right now?

Lets break the first Version 🍵
In its current state, ColorBrew lets you:

Generate color palettes: Feeling a bit out of tune with your color schemes? No worries, just generate palettes and let the colors inspire you.
Save palettes: You like it, you save it! Easy as that.
Download palettes: Your creation isn’t just stuck in the browser, take it with you, use it wherever!
Explore palette themes: Not just a random generator—there’s a whole world of curated color themes for you to dive into.
Dark mode: Play with the dark mode!!

Not bad, right? But that’s just the start! The current version does what it needs to, but there’s so much to add. I know, I know—it’s not perfect yet (I can hear the UX/UI folks rolling their eyes 👀). Don’t worry, I’m working on it!

I have already got a roadmap set for some exciting features, and I am really pumped up about them. Here’s a sneak peek at what's brewing in my brain for the next version(s):

Extract colors from images: Upload an image, and voilà! You will get a palette based on the colors in it. This one is going to be really useful for designers or anyone who likes finding inspiration in photos.
Generate gradient palettes: Because lets face it, gradients are in!. Simple solid colors are cool and all, but lets get those smooth transitions in there.
Chrome & Figma extensions: I mean, who doesn’t love a good extension? Whether you’re working on your next big web project or sketching out ideas in Figma, you’ll be able to use ColorBrew right there where you work.

As I said earlier, the UI isn’t perfect (yet🫤), and I plan to give it some love soon. The goal? A much smoother, more intuitive experience.

Now lets talk about the techstack. For the fellow devs out there (you know who you are), ColorBrew.co is built using:

Next.js, Because SEO matters, and I love how easy it makes routing.
Tailwind CSS, Stylish? Check. Easy?_ Double-check_. If you haven’t jumped on the Tailwind yet, you should!
TypeScript, Safety first, folks. I need my code to make sense (most of the time).

But the main question is Why Didn’t I Deploy Earlier? 🤔
Good question! Honestly, life just got in the way. You know how it goes—Office works, new projects, and suddenly two years fly by. But hey, better late than never! This year, I made it a point to revisit old projects, finish them up, and give them the love they deserve. So here I am, excited about giving ColorBrew.

Right now, I am working on polishing the UI and making the overall experience as smooth as possible. Once the revamp is done, I will be launching the new features I mentioned earlier. Stay tuned for updates—ColorBrew is evolving into something awesome!

That’s it for now! I do love to know what you think of the first version of ColorBrew. Drop by colorbrew.co and play around with it. If you have any suggestions (or want to throw compliments my way—hey, I wont complain), let me know! Cheers to colors, gradients, and all the cool things in between.

Stay tuned, and keep brewing those colors! 🎨🍻

Adios!!

What is CI/CD Pipelines: A Crucial Skill for Every Software Engineer🔥

Priyank Deep Singh — Mon, 22 Apr 2024 12:58:07 +0000

Staying up to date with the latest practices is critical to success in the world of software development.

One such practice that every software engineer should be familiar with is the CI/CD pipeline. CI stands for Continuous Integration and CD stands for Continuous Delivery and/or Continuous Deployment. Today i will explain what CI/CD is and why it matters, and provides a fun example to help you understand how it works.

What is CI/CD?
Continuous Integration (CI) is a development practice in which developers code integration distributed to the depot frequently, preferably several times a day. Each integration is then automatically tested. This helps identify bugs early in development, making them easier and cheaper to fix.

Continuous Delivery follows CI. This is the practice of automating the release of tested changes to a staging or production environment. Continuous Deployment, a step forward, automates the release process so that all approved changes can go straight to production.
Why every software engineer should learn CI/CD and it not only saves time but also reduces development costs when bugs are found. can be expensive in later stages of development

Higher release speed: CI/CD automates the deployment process, meaning new features, configurations, and updates can be rolled out quickly and efficiently.

Better product quality: common and thorough testing ensures that the product is as flawless as possible. Automated tests in the CI/CD pipeline help improve software quality.

Improved transparency: This process allows teams to see workflow, changes made, and test results, making the entire process more transparent for all involved.

Better customer satisfaction: Regular updates with new features and quick fixes keep customers happy and satisfied with the product.

Fun example: Bakery

Imagine you own a bakery. Every morning, your team decides on a new recipe (code) to add to the bakery menu. This is how CI/CD would work in your bakery:

Continuous Integration: When the chefs (developers) come up with a new recipe, they mix the ingredients (code changes) and immediately bake a small test cake (integrate the changes into the master branch and run automated tests). This will help you determine if the recipe is good or if it needs more sugar or maybe less baking. Early detection of errors in a recipe helps to quickly fix it.

Continuous Delivery: Once a new cake passes all taste tests (code checks and automated tests), it is then ready to be presented on screen (staging). server). Here the staff (QA team) can do a final check before it is offered to customers.

Continuous deployment: When the cake reaches the counter, it automatically becomes a standard item on the menu (goes into production). This means that every incoming customer can order that new cake.

Using this bakery analogy, you can see how CI/CD enables faster, more efficient and more reliable delivery of new recipes to customers, ensuring the competitiveness of the bakery and customer satisfaction.
Conclusion

CI /CD is an essential skill for today's software designers.

It not only improves product quality and project management, but also adapts to the agile method to adapt to change quickly and effectively. Learning CI/CD practices can greatly impact your career as a software engineer, making you a valuable asset to any development team.

By understanding and implementing CI/CD, engineers ensure that software development is not only fast and effective, but also consistent according to user needs and business objectives. So dive into the world of CI/CD and make your software development process as amazing as*_ baking a new cake!._*

Understand Javascript Call, Bind, and Apply in the Simplest and Easy Way Possible!!🔥

Priyank Deep Singh — Sat, 04 Feb 2023 15:08:31 +0000

We all know how much these Javascript methods are confusing to understand. But there is always a simple way to explain complex things. Close your eyes and imagine yourself in the vast universe! You have an amazing spaceship and you are on a mission to explore different planets in the universe 💥

On each planet, you have to collect energy crystals to power your spaceship, like we play in the game 'No Mans Sky'!! The energy crystals are in different shapes and sizes, and you have to add their values to see how much energy you have collected.

Let's start with Call:

"Call" is like giving a direct command to your spaceship computer to perform a specific task. In our case, you want to ask the computer to add the values of the energy crystals you have collected.

Here's an example of what that would look like in code:

With "Call," you can ask the computer to add the values of the energy crystals in a straightforward and direct way. The computer will instantly perform the task and give you the result.

Now let's move on to Bind:

"Bind" is like telling your spaceship computer ahead of time that you want to add the values of energy crystals, but also giving it one of the values.

Here's an example of what that would look like in code:

With "Bind," you can tell the computer ahead of time that you always want to add a specific value to the energy crystals, and the computer will remember that. The next time you want to add values, you can just give it the second value, and the computer will do the rest.

Finally, let's talk about Apply:

"Apply" is like giving your spaceship computer a group of values to add together, instead of giving them one by one.

Here's an example of what that would look like in code:

With "Apply," you can give the computer all the values of energy crystals at once, and the computer will add them up quickly and efficiently. This is a great option when you have a lot of values to add.

So, there you have it! With Call, Bind, and Apply, you can ask your spaceship computer to add the values of the energy crystals in different ways and complete your mission to explore the universe with ease!

Hope this was helpfull!!😊😊

How to use map() to iterate over array in ReactJS

Priyank Deep Singh — Sun, 18 Dec 2022 06:12:13 +0000

map() is used in ReactJS to iterate over an array and display the content on front end. It is a standard JavaScript function that can be called on any array. In the current example, we are working on the Functional component.

First, we need to have an array that we need to render. Like this:

Now we are going to loop through data array, that gives access of each item in the array and can return a JSX element.

Here we created a component called MapExample, and passed props it to it. props will contain data that would be used in this component, which will talk about later.

Here we are using map() on data the array.
The key prop is used to uniquely identify each item. It is used to give each element a unique identifier. We should always include a 'key' prop for each item in the list.

And Bingo! We are done. Now you can display data from any array using map() in react functional component.

Hope that helps!