Official Framer Resource

The Free No-code SaaS Website UI kit

Easily transform your ideas into a fully functional, responsive, no-code SaaS website design within minutes using these free components for Framer and Figma.

Get for free

Get for Framer

Get for Figma

Preview sections

Over 100 sections
and elements

Responsive design:
Desktop, Tablet and Mobile

3D assets in three different styles

100%
free

Drag-and-drop building, no coding

Publish to a free
domain with Framer

Design & Publish in Framer

Using the kit to build and publish your website

Quickly build and publish your website in minutes. Copy and paste sections and components in Framer to go from concept to live site.

Open in Framer

Preview sections

Step 1: Remix the kit

Begin with remixing the starter project to access all sections and elements.

Remix the kit

Step 2: Pick your elements

SaaS Website Kit has lots of popular designs for SaaS websites. Pick what you like and copy the elements.

Remix the kit

⌘

Step 3: Paste it in your project

Paste the elements in your Framer project and combine with other sections.

Remix the kit

Step 4: Make it yours & Publish

Customize the elements as you wish, then hit the Publish button. And your site it live!

Looking for inspiration? See example page

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Still unsure how to use the kit?

Browse FAQ

Kit preview

Versatile sections and components

Discover the perfect piece among over 100 sections and components from the kit.

3D Assets

Banner

Navigation

Button

Hero

Features

Pricing

Logo

Testimonials

FAQ

CTA

Tooltip

Footer

Typography

Page Example Light

Page Example Dark

Open in Framer

3D Assets

40 elements

Button

15 elements

Get started

Learn more

Hero

4 elements

Version 2.0 is here!

Pathway to productivity

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Get started

Learn more

Announcing series C.

One Task

at a Time

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes, one task at a time.

Get started

Version 2.0 is here!

Your pathway to better productivity

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Get started

Learn more

We are hiring!

See careers

Your pathway to better productivity

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Get started

Learn more

Features

8 elements

Progress tracking

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes, one task at a time.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

Secure data encryption

With end-to-end encryption, your data is securely stored and protected from unauthorized access.

Secure data encryption

With end-to-end encryption, your data is securely stored and protected from unauthorized access.

Secure data encryption

With end-to-end encryption, your data is securely stored and protected from unauthorized access.

Progress tracking

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes, one task at a time.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

Secure data encryption

With end-to-end encryption, your data is securely stored and protected from unauthorized access.

Secure data encryption

With end-to-end encryption, your data is securely stored and protected from unauthorized access.

Secure data encryption

With end-to-end encryption, your data is securely stored and protected from unauthorized access.

A more effective way to track progress

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

A more effective way to track progress

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Integration ecosystem

Enhance your productivity by connecting with your favorite tools, keeping all your essentials in one place.

Goal setting and tracking

Define and track your goals, breaking down objectives into achievable tasks to keep your targets in sight.

Celebrate the joy of accomplishment with an app designed to track your progress.

Integration ecosystem

Track your progress and motivate your efforts everyday.

Learn more

Integration ecosystem

Track your progress and motivate your efforts everyday.

Learn more

Integration ecosystem

Track your progress and motivate your efforts everyday.

Learn more

Goal setting and tracking

Set and track goals with manageable task breakdowns.

Learn more

Goal setting and tracking

Set and track goals with manageable task breakdowns.

Learn more

Goal setting and tracking

Set and track goals with manageable task breakdowns.

Learn more

Secure data encryption

Ensure your data’s safety with top-tier encryption.

Learn more

Secure data encryption

Ensure your data’s safety with top-tier encryption.

Learn more

Secure data encryption

Ensure your data’s safety with top-tier encryption.

Learn more

Customizable notifications

Get alerts on tasks and deadlines that matter most.

Learn more

Customizable notifications

Get alerts on tasks and deadlines that matter most.

Learn more

Customizable notifications

Get alerts on tasks and deadlines that matter most.

Learn more

Progress Dashboard

Track your progress and motivate your efforts everyday.

Learn more

Progress Dashboard

Track your progress and motivate your efforts everyday.

Learn more

Progress Dashboard

Track your progress and motivate your efforts everyday.

Learn more

Collaborative workspaces

Share tasks and progress in a real-time team space.

Learn more

Collaborative workspaces

Share tasks and progress in a real-time team space.

Learn more

Collaborative workspaces

Share tasks and progress in a real-time team space.

Learn more

Intuitive time tracking

Track your progress and motivate your efforts everyday.

Learn more

Intuitive time tracking

Track your progress and motivate your efforts everyday.

Learn more

Intuitive time tracking

Track your progress and motivate your efforts everyday.

Learn more

Advanced filters

Find exactly what you need with custom task filters.

Learn more

Advanced filters

Find exactly what you need with custom task filters.

Learn more

Advanced filters

Find exactly what you need with custom task filters.

Learn more

Celebrate the joy of accomplishment with an app designed to track your progress.

Integration ecosystem

Track your progress and motivate your efforts everyday.

Learn more

Integration ecosystem

Track your progress and motivate your efforts everyday.

Learn more

Integration ecosystem

Track your progress and motivate your efforts everyday.

Learn more

Goal setting and tracking

Set and track goals with manageable task breakdowns.

Learn more

Goal setting and tracking

Set and track goals with manageable task breakdowns.

Learn more

Goal setting and tracking

Set and track goals with manageable task breakdowns.

Learn more

Secure data encryption

Ensure your data’s safety with top-tier encryption.

Learn more

Secure data encryption

Ensure your data’s safety with top-tier encryption.

Learn more

Secure data encryption

Ensure your data’s safety with top-tier encryption.

Learn more

Customizable notifications

Get alerts on tasks and deadlines that matter most.

Learn more

Customizable notifications

Get alerts on tasks and deadlines that matter most.

Learn more

Customizable notifications

Get alerts on tasks and deadlines that matter most.

Learn more

Progress Dashboard

Track your progress and motivate your efforts everyday.

Learn more

Progress Dashboard

Track your progress and motivate your efforts everyday.

Learn more

Progress Dashboard

Track your progress and motivate your efforts everyday.

Learn more

Collaborative workspaces

Share tasks and progress in a real-time team space.

Learn more

Collaborative workspaces

Share tasks and progress in a real-time team space.

Learn more

Collaborative workspaces

Share tasks and progress in a real-time team space.

Learn more

Intuitive time tracking

Track your progress and motivate your efforts everyday.

Learn more

Intuitive time tracking

Track your progress and motivate your efforts everyday.

Learn more

Intuitive time tracking

Track your progress and motivate your efforts everyday.

Learn more

Advanced filters

Find exactly what you need with custom task filters.

Learn more

Advanced filters

Find exactly what you need with custom task filters.

Learn more

Advanced filters

Find exactly what you need with custom task filters.

Learn more

A more effective way to track progress

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Get started

A more effective way to track progress

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Get started

Progress tracking

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes, one task at a time.

Official Framer Resource

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes, one task at a time.

Pricing

2 elements

Pricing

Free forever. Upgrade for unlimited tasks, better security, and exclusive features.

Free

/month

Get started for free

Up to 5 project members

Unlimited tasks and projects

2GB storage

Integrations

Basic support

Pro

Logo

6 elements

Trusted by the world’s most innovative teams

Acme Corp

Quantum

Echo Valley

PULSE

APEX

Celestial

Trusted by the world’s most innovative teams

Acme Corp

Quantum

Echo Valley

PULSE

APEX

Celestial

Acme Corp
Quantum
Echo Valley
PULSE
APEX
Celestial

Acme Corp
Quantum
Echo Valley
PULSE
APEX
Celestial

Acme Corp

Quantum

Echo Valley

PULSE

APEX

Celestial

Acme Corp

Quantum

Echo Valley

PULSE

APEX

Celestial

Testimonials

4 elements

Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer

Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer

Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer

Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer
Acme Corp
“This app has completely transformed how I manage my projects and deadlines.”
Jamie Teller
CEO & Founder
Quantum
“Our team’s productivity has skyrocketed since we started using this tool. ”
Jordan Patels
Marketing Designer
Echo Valley
“The customizability and integration capabilities of this app are top-notch.”
Taylor Kim
Marketing Designer

We have worked with hundreds of amazing people

This app has completely transformed how I manage my projects and deadlines.

Jamie Teller

@jamietechguru00

Our team’s productivity has skyrocketed since we started using this tool.

Alex Rivera

@alexinnovates

The ability to collaborate in real-time, combined with powerful project tracking features, has made it indispensable for our daily operations.

Morgan Lee

@morganleewhiz

I was amazed at how quickly we were able to integrate this app into our workflow.

Casey Jordan

@caseyj

Planning and executing events has never been easier. This app helps me keep track of all the moving parts, ensuring nothing slips through the cracks.

Taylor Kim

@taykimm

The customizability and integration capabilities of this app are top-notch.

Riley Smith

@rileysmith1

Adopting this app for our team has streamlined our project management and improved communication across the board.

Jordan Patels

@jpatelsdesign

With this app, we can easily assign tasks, track progress, and manage documents all in one place.

Sam Dawson

@dawsontechtips

Its user-friendly interface and robust features support our diverse needs.

Casey Harper

@casey09

We have worked with hundreds of amazing people

This app has completely transformed how I manage my projects and deadlines.

Jamie Teller

@jamietechguru00

Our team’s productivity has skyrocketed since we started using this tool.

Alex Rivera

@alexinnovates

The ability to collaborate in real-time, combined with powerful project tracking features, has made it indispensable for our daily operations.

Morgan Lee

@morganleewhiz

I was amazed at how quickly we were able to integrate this app into our workflow.

Casey Jordan

@caseyj

Planning and executing events has never been easier. This app helps me keep track of all the moving parts, ensuring nothing slips through the cracks.

Taylor Kim

@taykimm

The customizability and integration capabilities of this app are top-notch.

Riley Smith

@rileysmith1

Adopting this app for our team has streamlined our project management and improved communication across the board.

Jordan Patels

@jpatelsdesign

With this app, we can easily assign tasks, track progress, and manage documents all in one place.

Sam Dawson

@dawsontechtips

Its user-friendly interface and robust features support our diverse needs.

Casey Harper

@casey09

FAQ

2 elements

Frequently asked questions

What payment methods do you accept?

We accept all major credit cards, PayPal, and various other payment methods depending on your location. Please contact our support team for more information on accepted payment methods in your region.

What payment methods do you accept?

How does the pricing work for teams?

Our pricing is per user, per month. This means you only pay for the number of team members you have on your account. Discounts are available for larger teams and annual subscriptions.

How does the pricing work for teams?

Our pricing is per user, per month. This means you only pay for the number of team members you have on your account. Discounts are available for larger teams and annual subscriptions.

Can I change my plan later?

Yes, you can upgrade or downgrade your plan at any time. Changes to your plan will be prorated and reflected in your next billing cycle.

Can I change my plan later?

Yes, you can upgrade or downgrade your plan at any time. Changes to your plan will be prorated and reflected in your next billing cycle.

Is my data secure?

Security is our top priority. We use state-of-the-art encryption and comply with the best industry practices to ensure that your data is stored securely and accessed only by authorized users.

Is my data secure?

Security is our top priority. We use state-of-the-art encryption and comply with the best industry practices to ensure that your data is stored securely and accessed only by authorized users.

Frequently asked questions

What payment methods do you accept?

How does the pricing work for teams?

Our pricing is per user, per month. This means you only pay for the number of team members you have on your account. Discounts are available for larger teams and annual subscriptions.

How does the pricing work for teams?

Our pricing is per user, per month. This means you only pay for the number of team members you have on your account. Discounts are available for larger teams and annual subscriptions.

Can I change my plan later?

Yes, you can upgrade or downgrade your plan at any time. Changes to your plan will be prorated and reflected in your next billing cycle.

Can I change my plan later?

Yes, you can upgrade or downgrade your plan at any time. Changes to your plan will be prorated and reflected in your next billing cycle.

Is my data secure?

Security is our top priority. We use state-of-the-art encryption and comply with the best industry practices to ensure that your data is stored securely and accessed only by authorized users.

Is my data secure?

Security is our top priority. We use state-of-the-art encryption and comply with the best industry practices to ensure that your data is stored securely and accessed only by authorized users.

CTA

6 elements

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Get started

Learn more

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Get started

Learn more

Get instant access

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Get instant access

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Get instant access

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Get started

Try demo

Get instant access

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Get started

Try demo

Footer

6 elements

About

Features

Customers

Pricing

Help

Careers

About

Features

Customers

Pricing

Help

Careers

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Product

Features

Integrations

Updates

FAQ

Pricing

Company

About

Blog

Careers

Manifesto

Press

Contact

Resources

Examples

Community

Guides

Docs

Legal

Privacy

Terms

Security

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes.

Product

Features

Integrations

Updates

FAQ

Pricing

Company

About

Blog

Careers

Manifesto

Press

Contact

Resources

Examples

Community

Guides

Docs

Legal

Privacy

Terms

Security

Typography

9 elements

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes, one task at a time.

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Version 2.0 is here!

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Celebrate the joy of accomplishment with an app designed to track your progress, motivate your efforts, and celebrate your successes, one task at a time.

Celebrate the joy of accomplishment with an app designed to track your progress and motivate your efforts.

Version 2.0 is here!

FAQ

Frequently asked questions

Explore answers to common questions about the SaaS Website Kit for Framer and Figma.

What is the SaaS Website UI Kit?

This SaaS UI Kit is a free, no-code toolkit designed for building a SaaS website quickly and easily. It includes a variety of pre-designed sections and components following common SaaS landing page patterns. The kit is available as a Framer project, fully equipped and ready for publication, as well as a Figma project containing two example demo pages.

What is a SaaS website?

A SaaS website is a specialized platform that serves as the digital storefront for businesses offering Software as a Service (SaaS). This type of website is integral to the software development and application development process, providing a comprehensive overview of the SaaS business and its offerings. At the heart of a SaaS website is the hero section, a strategically designed area that immediately captures visitors’ attention with compelling content and visuals, highlighting the core value proposition of the service.

For SaaS businesses, the website acts as a pivotal platform, showcasing the strengths and capabilities of their software solutions. It not only facilitates code software exploration through detailed descriptions and visuals but also offers direct access to resources like documentation and support forums.

What are key elements of a SaaS website?

In the realm of code development, SaaS websites often showcase the efficiency and versatility of the SaaS model, emphasizing the ease of integrating various code tools and code software into existing workflows. This is complemented by calls to action (CTAs), such as CTA buttons for signing up for free trials, requesting a product demo, or contacting sales. These CTAs are crafted to convert visitors into leads or customers, thereby boosting conversion rates.

A well-designed SaaS website employs a design system that includes a range of UI elements tailored to enhance user experience. This includes the use of white space to create a clean and uncluttered layout, making information more accessible and easier to digest. Additionally, the website may feature sections dedicated to social proof, such as testimonials and case studies, to build trust and credibility with potential customers.

How do I turn my project into a live website?

After assembling your website using the kit’s elements, publishing it with Framer is easy and free. Click the Publish button located in the top right corner of the Framer interface. Following this step will make your site live instantly.

Invite

Publish

Invite

Publish

How can I make my website responsive?

Before pasting the elements, set up breakpoints for desktop, tablet, and mobile in your Framer project. This ensures your elements look good on all devices.

How do I copy and paste elements into my project?

Copying elements is straightforward. Right-click on the section or element you want to use and choose Copy, or press ⌘+C (Mac) or Ctrl+C (Windows) on your keyboard.

How can I change the color of 3D shapes?

Personalize the color of your 3D shapes by selecting the shape, navigating to the Properties Panel on the right, and exploring various hues available under the Hue property.

How can I learn more about making websites in Framer?

To deepen your knowledge of building websites with Framer, visit Framer Academy. It's a comprehensive resource offering lessons on Framer basics, making your website interactive, adding animations, integrating with other tools, and much more.

Learn how to use Framer