https://componentsui.com/build/

Easily build complex components into your Carrd.co projects

A compilation of video and written step-by-step tutorials to help you build beautiful components like complex toggles in pricing tables, responsive navbars, dynamic sections, and more just by using Carrd elements and little pieces of code

https://componentsui.com/build

Every component [from Components UI] was fully ready to use but also highly customizable. I also purchased Build UI to add in some additional functionality and I am 100% pleased with the result.

Emily G

e.g. creative content


What's this

“I want to build a website to sell my products and services but…
...I don’t know how or where to start”

Hi! I’m Oscar O. Arévalo. I’m an industrial engineer and I like to build projects online. I’ve been using Carrd.co to build side hustles, to sell products and for other projects but found myself wanting to add complex components - like a navbar or a dynamic feature section - to a new Carrd project.

One starry night I decided to start Build UI: a compilation of step-by-step tutorials, videos and code snippets to guide you on how to make these complex components into your new or existing Carrd projects.

Build UI is meant to be used as a reference tool: Decide what component(s) you want to build in your project, follow the steps in the tutorial and copy the code (if necessary) to build it. That’s it.

"But I’m not a developer nor a designer"

I started Build UI with this in mind. You don’t need to know how to code or to be a web designer. It allows you to do just one thing: build complex and beautiful components without knowing any code and without paying a developer for it. Use it for you digital products, services, businesses and more.

Use Build UI whether you're a Carrd beginner or an expert. You can start from scratch and follow the tutorials to begin with a blank canvas. Then just add as many components on your website as you see fit. That easy.

https://youtu.be/DeK45rS4CCg

What's included

Step-by-step video and written tutorials with detailed illustrations

The eBook in PDF

The eBook is like the Master index. Here you’ll find a list of all the components available and the tutorial for each one

Tutorial Videos

When there’s a video available for the components’ tutorial you’ll find it referenced on the eBook so you can look it up on your Gumroad downloads

Code Snippets

Pieces of code that you can copy and paste in your Carrd project using the Embed element


Table of Contents

This is the complete list of components you'll be able to build. More components added regularly as free updates

Intro:

How to use build UI

  • 1.1. Sections & Assets

  • 1.2. Reference Tool

Intro:

The Set Up

  • 2.1. Setting the Canvas

  • 2.2. Background

Module 1:

Main Components

Module 2:

Pricing Components

  • 4.1. Simple Pricing Table → Preview

  • 4.2. Complex Pricing Table → Preview

Module 3:

Advanced Components

  • 4.1. Simple Pricing Table → Preview

  • 4.2. Complex Pricing Table → Preview

Module 4:

Code Snippets

  • 6.1. Back to Top Button PREVIEW

  • 6.2. Affiliate Banner PREVIEW

  • 6.3. Maker Widget PREVIEW

  • 6.4. Scroll Indicator PREVIEW

  • 6.5. Dynamic Feature Section PREVIEW

  • 6.6. Toggle in Simple Pricing Table PREVIEW

  • 6.7. Toggle in Complex Pricing Table PREVIEW

  • 6.8. Fixed Banner at the top with Blurred Background PREVIEW

  • 6.9. Fixed Banner at the Bottom with Blurred Background PREVIEW

  • 7.0. Responsive NavBar PREVIEW

Get a Free Sample

I know we like to try before we buy. Enter your email and you'll get sample chapters from the eBook PDF and tutorial videos that you can use immediately on your Carrd projects. You'll also receive occasional updates on the project

I respect your privacy. Unsubscribe at anytime.


It's not an expense.
It's an investment.

Build UI can help you save time and make money. It can pay for itself many times over when you use it to sell your products or services

Products

Build a product page for your physical or digital products. Use it to showcase your new book, comic, art, courses, designs, app and more

Services

If you are a consultant, an agency or offer services, you can build a landing page to sell them or to show your business

Businesses

Build a website for your company, online community, personal website, app landing page or other project you’ve been thinking about

What can you build

Use it to build landing pages for your products & services. Almost limitless possibilities

A few examples...

  • Product page for new Ebook

  • Sell digital products

  • Digital Agency Website

  • Promote and sell courses

  • Offer your services

  • Consultant website

  • Company website

  • Sell memberships for online community

  • Personal portafolio

  • App landing page

  • Software as a Service landing page

Build UI is a great companion for no-coders using Carrd. As a no-coder myself Build UI is a no brainer because it lets me stop wasting time trying to figure things out and start focusing on my landing page design.

Eduardo U

freelancer


Simple and Affordable Pricing

Choose a package that fits you

premium package

Get the eBook and tutorials to build the Main, Advanced and Pricing Components

$29 USD

  • eBook in PDF - 39 pages including:

Module 1 Main Components

Module 2 Pricing Components

Module 3 Advanced Components

  • Tutorial Videos

  • Free Updates

  • Use on unlimited projects

✨ best value

complete package

Get the full eBook and tutorials to build every component

$78 $59 USD

  • eBook in PDF - 64 pages including:

Module 1 Main Components

Module 2 Pricing Components

Module 3 Advanced Components

Module 4 Code Snippets

  • Tutorial Videos

  • Free Updates

  • Use on unlimited projects

code snippets package

Get the eBook and tutorials to build Pricing Components + Code Snippets Section

$49 USD

  • eBook in PDF - 45 Pages including:

Module 2 Pricing Components

Module 4 Code Snippets

  • Tutorial Videos

  • Free Updates

  • Use on unlimited projects

Ex. VAT. Any applicable tax will be added at checkout

You need a Carrd Pro Plus account to apply some of the tutorials in Build UI. Go to the URL http://try.carrd.co/oscar and get 30% off one Pro upgrade or renewal. I don't get a commission but you get a discount.

Components UI Products

Trusted by +100 makers around the world

https://componentsui.com

Learn the Basics

Don't know where to start? Get a free guide and learn the fundamentals of Carrd

Simple Pricing Tables

A free step-by-step guide on How to Build Simple Pricing Tables for your Carrd projects

get the guide →

10 days of Carrd

Tips, tutorials and exercises delivered daily to your email to improve your websites

get the guide →

Set up website analytics

A free step-by-step guide on how to set up website analytics in Carrd projects using Fathom Analytics

get the guide →

A week of better design

Tips, tutorials and exercises delivered daily to your email to improve your design skills

get the guide →

Read more on the blog

Check out tutorials, resources and useful information to apply to your websites built with Carrd

check out the blog →

Oscar nailed it again! Build UI is the most in-depth resource for building and upgrading your Carrd sites.

Martyn Bromley

founder of no-code supplies


Frequently Asked Questions

Who is behind this project?

This is a product by Components UI

Hey! I’m @oscaroarevalo, the creator of Build UI. I’m an industrial engineer, writer and builder of things on the internet. Normally I’m working as a consultant and writing ideas about business development – operations, products, marketing – and personal growth. You can read more about me here

Do I have to know how to code to use this?

No. The Code Snippets are just pieces of code that you can copy and paste in your Carrd project using the Embed element. Every Code Snippet has a detailed video/written tutorial to guide you every step into building it on your Carrd website

Is this for me?

Build UI is for anyone that wants to build a beautiful website in Carrd. Whether you are a professional entrepreneur or someone who wants to start a side project for extra income, Build UI will help you in developing a landing page or website to showcase your new book, comic, art, designs, app, business and more

How will you send me the product?

When you purchase Build UI you'll get a confirmation email that gives you instant access to the eBook and video tutorials. You can consume the content all at once or return to it whenever you want

Is Build UI and Components UI the same thing?

No. They are two different products but they work great together. You can learn the difference between them and how you can use Components UI and Build UI for your projects by clicking here

Do I get updates? How frequently?

Yes. With every purchase you get free updates and I'm constantly adding new components, tutorials and code snippets. You can visit the changelog page to review all the updates that I've shipped since launching the project.

Is my credit card information secured?

Yes. All transactions are made thru Gumroad

What am I allowed to do with Build UI?

You can use the components in unlimited projects for commercial or personal use. You cannot redistribute, resell, lease, license, sub-license or offer any of the components "as is" to any third party, website or online marketplace. You cannot create derivative products like themes, templates or anything else where you would be repackaging and/or redistributing the components. Read the license here. Please be kind :)

What if I purchased it and I don’t like it?

If you purchase any package and found out you don’t like the material or you can’t find the value in it, just reply with your purchase receipt email within 30 days and I will issue a refund. No questions asked. I want you to be happy with your purchase

Can I buy pre-built Components and Templates?

Yes. Go to Components UI. You can also buy templates at Templates UI

I have another question!

No problem. Write me a email at oscar@oscaroarevalo.com

Build beautiful components in your Carrd.co websites

Build UI is a compilation of step-by-step tutorials, videos and code snippets to guide you on how to make pricing tables, badges, dynamic sections, and more into your new or existing Carrd projects

Made with in El Salvador, CA
Published with Components UI

A project by

https://componentsui.com
@oscaroarevalo @oscaroarevalo