Getting Started with Figma: Components (Design Once, Use Everywhere)

Now that we’ve learned how to structure a screen properly using layout… There's one more thing that completely changed the way I design.

At the beginning, I didn’t know this.

And because of that, I made things much harder for myself.

Whenever I needed a button, I would just create it again. Or copy and paste it. It felt easy at that time. But slowly, my designs started getting messy.

One button would have slightly different spacing. Another one would have a different shade of color. Some buttons looked okay… some didn’t.

And the worst part?

If I wanted to change something, I had to go and update everything manually.

I thought this was normal.

It wasn’t.

The first time I learned about components, I didn’t feel confident at all.

In fact… I was scared.

I remember my first presentation where I used a component.

I kept thinking:

“What if this doesn’t work?”

“What if I change something and everything breaks?”

I was honestly more worried about that than the actual presentation.

But I still tried it.

And when I made one change… and saw everything update automatically…

That’s when it clicked.

Components are actually very simple.

Think about it like this.

If you are cooking something at home, you don’t cook the same dish again and again for every person. You make it once. And then serve it wherever needed. That’s exactly what a component is.

You design something once. And then reuse it.

In Figma, a component is just a reusable design.

It can be anything.

A button. An input field. A card.

Anything that you use more than once.

Let’s take a simple example.

Create a button.

Just a basic one.

A rectangle with some text inside. Give it a color, add some padding, and make it look clean.

Now select it and convert it into a component.

That’s it.

Now when you copy it and use it in different places, those are not just copies anymore. They are connected.

If you change the original one, everything updates automatically.

This is where everything becomes easier.

Before this, I used to worry about consistency.

Now I don’t.

Before this, updating designs was tiring.

Now it takes seconds.

One mistake I made early on was thinking components are not necessary.

I used to tell myself the following:

“This is a small design… I’ll manage without it.”

But as the design grew, everything became difficult to handle.

That’s when I understood…

Components are not something extra.

They are actually part of the process.

You don’t have to use it everywhere immediately.

Start small.

Create one button as a component.

Use it.

Understand how it works.

That’s enough for now.

From here, designing starts feeling a little more controlled.

A little cleaner.

A little more… professional.

In the next article, we’ll take this one step further. Because in real projects, we don’t just have one button. We have multiple types. Primary button. Secondary button. Disabled button. And managing all of that properly… That’s where variants come in.

See you in the next session.

Previous Session: Getting Started with Figma: Designing Your First Proper Screen (Without Making It Messy) | by Lakshmipriya Bolagani | Apr, 2026 | Medium

Next Session: Getting Started with Figma: Understanding Variants | by Lakshmipriya Bolagani | Apr, 2026 | Medium