Unlimited customisation possibilities, no-code tools of a classic editor. Visual interface, adaptive design settings, code editor, React components, all possibilities of CSS. Choose from one of many pre-made blocksCreate Project
Fundamental building blocks resembling HTML tags, such as Text, Image, and Box.
Themes make it easy to create a consistent look for your website.
Now your website will be noticed! Use our unique animations, catchy layouts, and transformations.
Fine-tune your adaptive design
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.
Enhance your page with ready-made blocks including maps, videos, pop-ups, and more.
Customizing design with breakpoints
Ensure your website is fully responsive by using tailored design solutions for elements at breakpoints.
Adding and editing breakpoints
Add your own breakpoints or modify existing ones in the project theme.
You can place elements wherever you want on a page — that's up to you. You can drop them in the desired area, or nest them in other ones.
Take control of multiple elements by selecting them and setting styles, moving, deleting, or doing more.
Style text as desired, make it bold or italic, turn it into a link or convert it to span, the choice is yours.
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
At Quarkly, we use the most advanced frontend coding techniques.
Configuring styles of pseudo-classes hover/active/focus, etc.
To modify the look of an element, such as its hover appearance, simply enable "hover" and customize the properties.
Google Fonts Connection
Use fonts from a library that has over 990 font families in it to make your website look more colorful.
Utilize Unsplash, one of the most widely used free image banks, to choose images directly from the Quarkly interface.
Take advantage of the categorized style and props.
Here you will find the element display properties.
Use the properties in this section to change the text's appearance.
To set margins and paddings, open these settings.
Here, you will have access to props for element background setup.
Here you can set up borders and border radius.
This category contains settings for configuring the position and z-index of elements.
This property makes it easier for an element to change from one state to another.
With the help of this property, you can rotate or zoom an element.
Create custom React components using the code editor
In Quarkly, you can create custom React components in the code editor and then place them on the page.
The pages are written in JSX code typical for React.js.
Hot import from NPM
It has never been simpler to import modules from NPM into your component.
Optimize your site to promote it on search engines.
Your project can be finished or hosted on your server by exporting it into an archive using a create-react-app project.
Fine-tune elements in the code editor.
Export to Gatsby Project
You can easily export your projects to Gatsby, which is a popular static site generator.
Pushing commits to your GitHub repository
You can build a GitHub repository for your projects if necessary and commit updates there.
Publication on Netlify
Publish your website to Netlify once it is complete. Its technical domain name will be generated automatically.
Modern built-in code editor
All of the page's entities are visible in the editor.
Errors in the component code or pages can be tracked by viewing the debug console.
Tooltips in the code
If you're not sure how to spell a property, type the first few letters and the editor will complete it for you.
Synched pages and code editor
No matter what changes are made to the pages or code, both are always in sync.
Utilize the Quarkly collaboration tool to work on a project with your teammates; all you need to do is invite them.
Any part can serve as a tag. Just choose the "as" property's desired value.
You can give elements the desired attributes through the code editor.
A unique attribute of the "Image" element.
Customize your device icons and set individual tile background color on Windows 10.
Open graph and meta tags
These settings will help your site display correctly on social networks and in search engines.
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 automatically generated. You can edit these files to suit your needs for the future.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.Create project