Completely free — you should try it now. Create your website from scratch or ready-to-use templates. Unlimited customisation possibilities, no-code tools of a classic editor
Create ProjectPrimitives
Basic components with a similarity to HTML tags, like Text, Image, Box, and others.
Themes
Themes make it easy to give your website a unified appearance.
Extended Styling
Now your website will be noticed! Use our unique animations, catchy layouts, and transformations.
Adaptive design
Fine-tune your adaptive design
Components
You can choose an element (or a group of elements) on the page and convert them into a component. Add copies to the page and they will inherit all the props.
Ready-made Content
Add ready-made blocks: maps, videos, pop-ups, and many more
Customizing design with breakpoints
Your website will automatically adjust to different screen sizes, with different design solutions for elements at breakpoints.
Adding and editing breakpoints
Use your personal breakpoints or select one of the ones already in place.
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
You can select multiple elements and move them to another location, remove them, and more.
Text editor
You can turn a part of the text into italic or bold, make it a link or convert to span, and use any style for it.
Deep select
Click twice to go up and down the hierarchy of elements. If you need to get inside the hierarchy, hold down Ctrl on Windows or Cmd on MacOs.
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 alter how an element appears, for instance in a hover state, activate the "hover" prop and arrange the desired props.
Google Fonts Connection
The library of over 990 font families will help make your site look more beautiful.
Unsplash images
Use Unsplash, a top-rated free image stock, to search for images and select them directly from Quarkly.
Props panel
Here you can find all the styles and functional properties.
Layout
This section lets you control how elements appear.
Typography
To find the text style properties, go to this section.
Indents
Open these settings to configure margins and paddings.
Background
Props for setting up element backgrounds can be found in this section.
Borders
You can change the border radius and borders in this section.
Position
Element position and z-index settings can be adjusted in this category.
Transition
Elements can easily transition from one state to another thanks to this property.
Transform
You can transform the element using this property, for instance, rotate or zoom.
Create custom React components using the code editor
You can design distinctive React components in the Quarkly code editor and then insert them on the page.
React.js
The pages are written in JSX code typical for React.js.
Hot import from NPM
Import modules to your component from NPM in no time, if needed.
SEO
Optimize your site to promote it on search engines.
Export CRA
You can export your project as an archive using a create-react-app project if you want to finish it or host it on your server.
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
If needed, 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
In the Quarkly editor, you can keep an eye on each thing on the page.
Debugger
Errors in the component code or pages can be seen in the debug console.
Tooltips in the code
If you are not sure how to spell a property, start typing and the editor will help you.
Synched pages and code editor
All changes made to the pages are displayed in the code and vice versa.
Collaboration
Work on a project together with your team using the Quarkly collaboration tool, simply send them an invitation.
Semantic tags
Transform components into tags with ease by choosing the right "as" property value.
Schema.org
You can give elements the desired attributes through the code editor.
Image ALT
This is an individual property that belongs to the “Image” element.
Favicons
This feature allows you to install icons for all devices and change the background color of individual tiles in Windows 10.
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
Make sure you use human-readable URLs to improve your site's SEO.
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