Complete design control, supports Grid and Flexbox. Create your website from scratch or ready-to-use templates. Unlimited customisation possibilities, no-code tools of a classic editor
Create ProjectPrimitives
Primitive content elements function similarly to HTML tags. For example, Text, Image, and Вох.
Themes
It's simple to give your website a unified look with themes.
Extended Styling
Boost your websites' functionality with distinctive layouts, animations, effects, and transformations.
Adaptive design
Fine-tune your adaptive design
Components
Select a single element or multiple elements on the page or Layer panel and convert them into a component. Place component copies on the page and enjoy the inheritance of all properties.
Ready-made Content
Add videos, pop-ups, customized blocks, and much more to your site.
Customizing design with breakpoints
Check out your 100% adaptive website by using different design solutions for elements and breakpoints.
Adding and editing breakpoints
Add your own breakpoints or modify existing ones in the project theme.
Drag'n'Drop
You decide where to place the elements. Move them wherever you want, or nest them in other elements.
Multiselect
You can select multiple elements and apply formatting to them, drag them to another spot in the document, or remove them from their current location.
Text editor
You can link certain passages of text, make them bold or italic, or both. You can choose the font face, size, and color as well.
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
At Quarkly, we use the most advanced frontend coding techniques.
Configuring styles of pseudo-classes hover/active/focus, etc.
To change the appearance of an element, for example, its hover behavior, enable the "hover" prop and apply any desired additional props.
Google Fonts Connection
Use the library of over 990 font families to make your site look more beautiful
Unsplash images
Utilize Unsplash, one of the most widely used free image banks, to choose images directly from the Quarkly interface.
Props panel
Style and utility characteristics are categorized here.
Layout
Explore element display properties in this location.
Typography
Check out this section to take advantage of text style properties.
Indents
You can modify the padding and margins in these settings.
Background
Props for setting up element backgrounds can be found in this section.
Borders
You can define borders and border radius using these options.
Position
This category helps you configure the position and z-index settings of elements.
Transition
An element can transition from one state to another without interruption thanks to this property.
Transform
This property will help you transform the element, for instance, rotate or zoom.
Create custom React components using the code editor
With the Quarkly code editor, you can create unique React components and then place them on the page.
React.js
The pages are written in JSX code typical for React.js.
Hot import from NPM
Importing modules to your component from NPM has never been easier.
SEO
Optimize your site to promote it on search engines.
Export CRA
If you need to complete or host your project on your own server, it's easy: just 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 projects to Gatsby, which is a popular static site generator.
Pushing commits to your GitHub repository
Effortlessly, you can make a GitHub repository for your project and commit changes.
Publication on Netlify
Once it is complete, publish your website on Netlify. It will automatically generate a technical domain.
Modern built-in code editor
The editor displays all the entities of the page.
Debugger
When there are errors in the component code or pages, they can be seen in the debug console.
Tooltips in the code
Start typing if you're unsure of how to spell a word, and the editor will fill in the blanks for you.
Synched pages and code editor
Pages and code are updated in real-time, displaying all changes made in both areas.
Collaboration
Profit from the Quarkly collaboration tool by inviting your colleagues to work on a project with you.
Semantic tags
Every component can act as a tag. Just choose the “as” property value that you need.
Schema.org
In the code editor, you can assign desired attributes to any element.
Image ALT
The "Image" element has a unique property.
Favicons
Set up unique Windows tile background colors and exclusive icons for multiple devices.
Open graph and meta tags
These settings are meant for the correct display of your website in search engine results and social media
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 automatically produced. But if necessary, you can alter them.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project