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 editorCreate Project
Primitive content elements function similarly to HTML tags. For example, Text, Image, and Вох.
It's simple to give your website a unified look with themes.
Boost your websites' functionality with distinctive layouts, animations, effects, and transformations.
Fine-tune your adaptive design
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.
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.
You decide where to place the elements. Move them wherever you want, or nest them in other elements.
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.
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.
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
Utilize Unsplash, one of the most widely used free image banks, to choose images directly from the Quarkly interface.
Style and utility characteristics are categorized here.
Explore element display properties in this location.
Check out this section to take advantage of text style properties.
You can modify the padding and margins in these settings.
Props for setting up element backgrounds can be found in this section.
You can define borders and border radius using these options.
This category helps you configure the position and z-index settings of elements.
An element can transition from one state to another without interruption thanks to this property.
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.
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.
Optimize your site to promote it on search engines.
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.
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.
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.
Profit from the Quarkly collaboration tool by inviting your colleagues to work on a project with you.
Every component can act as a tag. Just choose the “as” property value that you need.
In the code editor, you can assign desired attributes to any element.
The "Image" element has a unique property.
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
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