What do you think about us? Fill out the survey! 🤗⚡️ We are hiring! Check out our vacancies ⚡️

Web app maker for frontend coders.
Meet Quarkly.

Unlimited customisation possibilities, no-code tools of a classic editor. Choose from one of many pre-made blocks. Complete design control, supports Grid and Flexbox

Create Project

FOR WEB DESIGNERS

Absolute control over the design.

Primitives

These are the fundamental elements, which are similar to HTML tags: Text, Image, Box, and others.

Themes

Using themes will help your website's design remain consistent.

Extended Styling

Supercharge your sites with unique layouts, animations, effects, and transformations

Adaptive design

Fine-tune your adaptive design

Components

You can choose an element (or a group of elements) on the page and convert them into a component. Add copies to the page and they will inherit all the props.

Ready-made Content

Add videos, pop-ups, customized blocks, and much more to your site.

Quarkly Features. Example of how page looks with different breakpoints

Customizing design with breakpoints

Check out your 100% adaptive website by using different design solutions for elements and breakpoints.

Quarkly Features. Part of Quarkly interface featuring breakpoint settings

Adding and editing breakpoints

In the project theme, you may want to add custom breakpoints or edit existing ones.

Drag'n'Drop

You choose where to put the elements. You can move them around or nest them in other elements.

Multiselect

You can remove, drag to a different location, style, remove, and more multiple elements simultaneously.

Quarkly Features. Partly styled text with text edit panel

Text editor

You can apply any style, make a portion of the text bold or italic, a link or span, or any other formatting.

Deep select

Click twice to go up and down the hierarchy of elements. If you need to get inside the hierarchy, hold down Ctrl on Windows or Cmd on MacOs.

Quarkly Features. Abstract examples of flexbox and grid

Support of Flexbox and Grid

At Quarkly, we keep up with the up-to-date frontend coding approaches.

Quarkly Features. Example of buttons with different styles depending on pseudo-class

Configuring styles of pseudo-classes hover/active/focus, etc.

To change the appearance of an element, such as changing its behavior on hover, just enable "hover" and set up the desired props.

Google Fonts Connection

To make your site design look more professional go and use a library of more than 990 font families.

Unsplash images

Make use of Unsplash, one of the most popular free image stocks where you can select images directly from the Quarkly interface

Props panel

Here you can find all the styles and functional properties.

Layout

In this section, you can configure element display properties.

Typography

You can apply the text style properties found here to your text.

Indents

To set margins and paddings, open these settings.

Background

Here you'll find some props to help you set up element backgrounds.

Borders

Here you can configure borders and border radius.

Position

This category lets you fine-tune element position and z-index settings.

Transition

This property makes it easier for an element to change from one state to another.

Transform

This property allows you to transform the element, for example, rotate or zoom.

Create project

FOR WEB DEVELOPERS

Development capabilities.
Supercharged.

Create custom React components using the code editor

You can build and add custom React components to your Quarkly pages using the code editor.

React.js

The pages are written in JSX code typical for React.js.

Hot import from NPM

Importing modules to your component from NPM has never been easier.

Semantic tags

SEO

Optimize your site to promote it on search engines.

Export CRA

If your goal is to host a project on your server, here's the one thing you have to do: export it into an archive with a create-react-app project!

Code Editor

Fine-tune elements in the code editor.

Export to Gatsby Project

In no time, you can export your projects to Gatsby — one of the best open-source SSGs

Quarkly Features. Part of Quarkly interface featuring list of layers and contextual menu

Pushing commits to your GitHub repository

Create a GitHub repository for your project and commit changes as you work.

Publication on Netlify

Publish your site on Netlify once it's ready. A technical domain will be created automatically for it, for example: https://inspiring-beaver-d128ed.netlify.app.