All-in-one website builder on React — Quarkly. Unlimited customisation possibilities, no-code tools of a classic editor. Completely free — you should try it now
Create ProjectPrimitives
These are the fundamental elements, which are similar to HTML tags: Text, Image, Box, and others.
Themes
Themes make it easy to give your website a unified appearance.
Extended Styling
Make your websites more useful by adding original layouts, animations, effects, and transformations.
Adaptive design
Fine-tune your adaptive design
Components
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.
Ready-made Content
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.
Drag'n'Drop
You choose where to put the elements. You can move them around or nest them in other elements.
Multiselect
You can apply styles to multiple elements at once and move them around, as well as remove them.
Text editor
Style text as desired, make it bold or italic, turn it into a link or convert it to span, the choice is yours.
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
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.
Unsplash images
Select stunning images from the Unsplash library directly through the Quarkly interface.
Props panel
Style and utility characteristics are categorized here.
Layout
You can find the element display properties under this section.
Typography
To change the style of your text, use special properties in this section.
Indents
Open these settings to configure margins and paddings.
Background
For element backgrounds, look in this section for props.
Borders
You can set borders and border radius in this section.
Position
This category allows you to position elements and set their z-index values.
Transition
This property makes it possible for elements to move smoothly from one state to another.
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
You can easily import modules from NPM to your component.
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
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.
Debugger
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.
Collaboration
Work on a project together with your team using the Quarkly collaboration tool, simply send them an invitation.
Semantic tags
Component-to-tag transformation made simple with the right "as" property value selection.
Schema.org
You can give elements the desired attributes through the code editor.
Image ALT
This is a separate property of the “Image” element.
Favicons
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.
User-friendly URL
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