All-in-one website builder on React — Quarkly. Unlimited customisation possibilities, no-code tools of a classic editor. Completely free — you should try it nowCreate Project
These are the fundamental elements, which are similar to HTML tags: Text, Image, Box, and others.
Themes make it easy to give your website a unified appearance.
Make your websites more useful by adding original layouts, animations, effects, 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.
Use the ready-made blocks such as maps, videos, pop-ups, and more to enhance your site.
Customizing design with breakpoints
You can make sure your site is mobile-friendly by designing different solutions for elements at breakpoints.
Adding and editing breakpoints
You can customize the breakpoints in your project theme by adding or editing them.
You choose where to put the elements. You can move them around or nest them in other elements.
You can apply styles to multiple elements at once and move them around, as well as remove them.
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
The most cutting-edge frontend coding techniques are supported by Quarkly.
Configuring styles of pseudo-classes hover/active/focus, etc.
To alter how an element appears, for instance in a hover state, activate the "hover" prop and arrange the desired props.
Google Fonts Connection
Connecting fonts from a library with more than 990 font families will help your website design express the personality of your brand.
Select stunning images from the Unsplash library directly through the Quarkly interface.
Style and utility characteristics are categorized here.
You can find the element display properties under this section.
To change the style of your text, use special properties in this section.
Open these settings to configure margins and paddings.
For element backgrounds, look in this section for props.
You can set borders and border radius in this section.
This category allows you to position elements and set their z-index values.
This property makes it possible for elements to move smoothly from one state to another.
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.
The pages are written in JSX code typical for React.js.
Hot import from NPM
You can easily import modules from NPM to your component.
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
You can easily export your work to Gatsby, a popular static site generator.
Pushing commits to your GitHub repository
Create a GitHub repository for your project and make commits with ease.
Publication on Netlify
When your site is ready, publish it on Netlify. It'll have a technical domain, for example: https://inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
You can monitor all the entities on the page in the Quarkly editor.
The debug console shows errors in the component code or pages.
Tooltips in the code
Start typing and the editor will correct you if you don't know how to spell a particular property.
Synched pages and code editor
The code and pages both reflect any modifications made to the pages.
Work on a project together with your team using the Quarkly collaboration tool, simply send them an invitation.
Component-to-tag transformation made simple with the right "as" property value selection.
You can give elements the desired attributes through the code editor.
This is a separate property of the “Image” element.
Get creative with device icons and tile background color on Windows 10 with this exclusive setup feature.
Open graph and meta tags
Configure these settings to display your website correctly in search engine results and social media.
Create user-friendly URLs to boost the usability of the resource and the ranking of your site in the search engines.
Robots.txt and sitemap.xml
These files are created automatically. But you can edit them the way you like.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.Create project