Create your website from scratch or ready-to-use templates. Unlimited customisation possibilities, no-code tools of a classic editor. All-in-one website builder on React — Quarkly
Create ProjectPrimitives
A website is made up of fundamental elements similar to HTML tags. For example, Text, Image, and Вох.
Themes
Themes can help you design your website consistently.
Extended Styling
Use animation, effects, and transformations to make your web page come to life.
Adaptive design
Fine-tune your adaptive design
Components
On the Layer panel, choose the element or group of elements you want to convert to a component. All of the props will be inherited if you add duplicates of the components to the page.
Ready-made Content
With pre-made blocks, you can add maps, videos, pop-ups, and more to your website.
Customizing design with breakpoints
Ensure your website is fully responsive by using tailored design solutions for elements at breakpoints.
Adding and editing breakpoints
You have an opportunity to use breakpoints of the project theme or download your own ones.
Drag'n'Drop
Place elements exactly where you want them on the page, whether it be by dropping them, nesting them, or moving them.
Multiselect
Take control of multiple elements by selecting them and setting styles, moving, deleting, or doing more.
Text editor
Any style, a hyperlink, a span, an italicized or bolded section of the text, or other formatting options are available.
Deep select
Double clicking allows you to move up and down the element hierarchy, while holding Ctrl/Cmd lets you access deeper levels.
Support of Flexbox and Grid
Advanced frontend coding is at the forefront of Quarkly's approach.
Configuring styles of pseudo-classes hover/active/focus, etc.
Activate the "hover" prop and set up the desired props to change how an element appears, for example, in a hover state.
Google Fonts Connection
Make your website design look sleek and modern with the library of over 990 font families.
Unsplash images
Browse Unsplash's collection of free images and choose directly from the Quarkly interface.
Props panel
This offers categorized style and functional properties.
Layout
Under this section, you can find element display properties.
Typography
Explore text style properties here
Indents
Adjust margins and paddings with ease in these settings.
Background
Here, you will have access to props for element background setup.
Borders
You can change the border radius and borders in this section.
Position
You can modify the settings for element position and z-index in this category.
Transition
An element can transition from one state to another without interruption thanks to this property.
Transform
This property lets you transform the element, for example, zoom or rotate.
Create custom React components using the code editor
You can build custom React components in the Quarkly code editor and after that add them to the page.
React.js
The pages are written in JSX code typical for React.js.
Hot import from NPM
Import modules from NPM quickly, if you need to.
SEO
Optimize your site to promote it on search engines.
Export CRA
If you want to finish or host your project on your server, there is only one thing you need to do: export it as an archive using a create-react-app project.
Code Editor
Fine-tune elements in the code editor.
Export to Gatsby Project
Export your projects to Gatsby, one of the most well-known web frameworks for static site generation.
Pushing commits to your GitHub repository
Create a GitHub repository for your project and commit changes as you work.
Publication on Netlify
Once your site is ready, publish it on Netlify with a domain name like inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
The Quarkly editor contains all of the page's entities.
Debugger
Component code or page errors can be detected in the debug console.
Tooltips in the code
If you're unsure how to spell a property, start typing and the editor will provide suggestions.
Synched pages and code editor
When you edit a page, the changes are applied to the code and vice versa.
Collaboration
Quickly invite teammates to work on your projects in Quarkly.
Semantic tags
Each and every component can behave as a tag. Just choose the needed value of the “as” property.
Schema.org
You can give elements the desired attributes through the code editor.
Image ALT
A special property of the “Image” element.
Favicons
Install distinctive device icons and a customized Windows tile backdrop color.
Open graph and meta tags
Make sure your website stands out in search engine results and social media with these display settings.
User-friendly URL
Get the best of both worlds with human-readable URLs that improve your site's SEO and usability.
Robots.txt and sitemap.xml
These files are created automatically, but you can edit them as you see fit.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project