Unlimited customisation possibilities, no-code tools of a classic editor. Visual interface, adaptive design settings, code editor, React components, all possibilities of CSS. Create your website from scratch or ready-to-use templates
Create ProjectPrimitives
Fundamental building blocks resembling HTML tags, such as Text, Image, and Box.
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
Choose an element or a group of elements on the page or on the Layer panel and turn them into a component. Add component 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
Different design solutions will be used for elements at breakpoints as your website automatically adapts to different screen sizes.
Adding and editing breakpoints
Use your own breakpoints or choose one of the ones that are already there.
Drag'n'Drop
Have complete control over arranging elements on the page — drop them, nest them, or move them to your desired location.
Multiselect
You can select multiple elements to set their styles, drag'n'drop them to another place, remove, etc.
Text editor
You can bold or italicize part of the text; turn it into a link or a span; or apply any other style to 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
Quarkly supports the most modern methods of frontend coding.
Configuring styles of pseudo-classes hover/active/focus, etc.
To change the element appearance, for example, the way it behaves on hover, enable "hover" and apply the desired props.
Google Fonts Connection
Use fonts from a library that has over 990 font families in it to make your website look more colorful.
Unsplash images
Use Unsplash, a top-rated free image stock, to search for images and select them directly from Quarkly.
Props panel
Here you will find categorized style and functional properties.
Layout
Explore element display properties in this location.
Typography
To change text styles, use special properties in this section
Indents
You can configure margins and paddings in these settings.
Background
The section contains props that enable you to set element backgrounds.
Borders
Here you have access to the tools for adjusting borders and border radius.
Position
This category lets you fine-tune element position and z-index settings.
Transition
An element can transition from one state to another more easily thanks to this property.
Transform
Transform your element with ease using this property, for example, rotate or zoom.
Create custom React components using the code editor
Custom React components can be made in Quarkly's code editor and then inserted onto the page.
React.js
The pages are written in JSX code typical for React.js.
Hot import from NPM
Modules from NPM can be imported into your component.
SEO
Optimize your site to promote it on search engines.
Export CRA
If you want to finish or host your project on your server, you can export it into an archive with a create-react-app project
Code Editor
Fine-tune elements in the code editor.
Export to Gatsby Project
One of the most popular static site generators, Gatsby, can be the destination for your exported projects.
Pushing commits to your GitHub repository
You can establish a GitHub repository for your project and submit updates there.
Publication on Netlify
Once everything is complete, publish your website on Netlify using a technical domain name.
Modern built-in code editor
You can keep an eye on every entity on the page in the Quarkly editor.
Debugger
Errors in the component code or pages can be seen in the debug console.
Tooltips in the code
As you type, the editor will suggest possible matches to the property you're looking for.
Synched pages and code editor
All edits you apply to the pages are shown in the code and vice versa.
Collaboration
Make teamwork a breeze with the Quarkly collaboration tool, just send an invite to your coworkers.
Semantic tags
Any part can serve as a tag. Just choose the "as" property's desired value.
Schema.org
You can provide elements the appropriate characteristics in the code editor.
Image ALT
A special property of the “Image” element.
Favicons
Make your devices stand out with unique icons and personalized tile background color on Windows 10.
Open graph and meta tags
Your site will display appropriately thanks to these settings on social media and search engines.
User-friendly URL
It's a good idea to use human-readable URLs to improve your site's search engine optimization.
Robots.txt and sitemap.xml
These files are there for you to use. But you can change them and add to them as you see fit.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project