Unlimited customisation possibilities, no-code tools of a classic editor. Choose from one of many pre-made blocks. Completely free — you should try it nowCreate Project
Primitive content components work like HTML tags. For example, Text, Image, and Вох.
Create a consistent and professional-looking design with the help of themes.
Now your website will be noticed! Use our unique animations, catchy layouts, and transformations.
Fine-tune your adaptive design
Any combination of elements on the page or in a layer can be used to create reusable components. The component inherits all of its original properties when you add it to a page.
Place ready-made blocks on the page, for example, maps, videos, pop-ups, and more
Customizing design with breakpoints
Rest assured your site is completely mobile-friendly by using different 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.
Arrange elements however you want on the page, drop them on the desired area, or nest them in other elements.
You can drag and drop multiple elements to a different location, remove them, or change their styles while they are selected.
You can change the appearance of text — for instance, making it bold or italic, turning it into a link, or converting it to a span—as well as apply any style to it.
You can double-click to go up and down the hierarchy of your objects. If you need to get inside the hierarchy, hold down the Ctrl key on Windows or Cmd on MacOs.
Support of Flexbox and Grid
We're excited to offer you the best frontend coding practices around.
Configuring styles of pseudo-classes hover/active/focus, etc.
If you want to change the element look, for instance, how it appears on hover, enable "hover" and configure 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.
Use Unsplash, one of the most popular free image stocks that provide images you can use directly without downloading.
Make use of organized and categorized style and functional properties to improve your project.
You can set the element display properties in this section.
Use the properties in this section to change the text's appearance.
Adjust margins and paddings with ease in these settings.
Props in this section help create the backgrounds for the elements.
This section allows you to adjust borders and border radius.
With this category, you can fine-tune element position and z-index settings.
This property makes an element move smoothly from one state to another.
With the help of this property, you can rotate or zoom the element.
Create custom React components using the code editor
In Quarkly, the code editor provides the ability to build unique React components and add them to the page.
The pages are written in JSX code typical for React.js.
Hot import from NPM
Quickly import modules to your component from NPM when needed.
Optimize your site to promote it on search engines.
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!
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
You can create a GitHub repository for your project and commit changes.
Publication on Netlify
When your site is ready, publish it on Netlify with a technical domain name such as https://inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
The editor shows each and every entity that is present on the page.
In the debug console, component code or page errors might be found.
Tooltips in the code
The editor is here to help with property spelling — just start typing.
Synched pages and code editor
All changes made to the pages are displayed in the code and vice versa.
Check out the Quarkly collaboration tool: send an invite to your teammates to work on a project with them.
Component-to-tag transformation made simple with the right "as" property value selection.
In the code editor, you can assign desired attributes to any element.
A unique attribute of the "Image" element.
Install distinctive device icons and a customized Windows tile backdrop color.
Open graph and meta tags
Configure these settings for the correct display of your website in search engine results and social media.
You may create user-friendly page URLs with this capability.
Robots.txt and sitemap.xml
Automatically generated files open for your editing and personalization.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.Create project