Use pre-made React components or build your own. Create your website from scratch or ready-to-use templates. Unlimited customisation possibilities, no-code tools of a classic editorCreate Project
Website is composed of basic components similar to HTML tags such as Text, Image, and Вох.
Utilize themes to build a consistent and attractive design for your website.
With stylish animations, effects, and transformations, you can make your web page more exciting.
Fine-tune your adaptive design
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.
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
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.
Take control of multiple elements by selecting them and setting styles, moving, deleting, or doing more.
Bold, italic, link, span, and other styles, all options to make your text stand out.
Double-click the elements to move up and down in their hierarchical order. Hold down the Ctrl key on Windows or the Cmd key on Mac OS to descend into the hierarchy.
Support of Flexbox and Grid
We follow up-to-date frontend coding approaches at Quarkly.
Configuring styles of pseudo-classes hover/active/focus, etc.
Simply enable "hover" and arrange the desired props to alter the appearance of an element, such as how it behaves on hover.
Google Fonts Connection
To make your site design look more professional go and use a library of more than 990 font families.
One of the most well-liked free photo sites is Unsplash. From the Quarkly interface, you can search for and choose images.
Make use of organized and categorized style and functional properties to improve your project.
Explore element display properties in this location.
You can apply the text style properties found here to your text.
You can modify the padding and margins in these settings.
This section offers props for setting up element backgrounds.
You can change the border radius and borders in this section.
This category helps you configure the position and z-index settings of elements.
This property helps an element move smoothly from one state to another.
Use this property to seamlessly transform your element, for example, by rotating or zooming.
Create custom React components using the code editor
With the Quarkly code editor, you can create custom React components and then use them on a webpage.
The pages are written in JSX code typical for React.js.
Hot import from NPM
You can import modules to your component from NPM.
Optimize your site to promote it on search engines.
There is just one thing to do if you want to finish or host your project on your server: export it into an archive with a create-react-app project!
Fine-tune elements in the code editor.
Export to Gatsby Project
Export your projects to Gatsby, a highly regarded static site generator.
Pushing commits to your GitHub repository
Want to add modifications to a GitHub repository you've created for your project? Well, you can. With Quarkly.
Publication on Netlify
Publish your site on Netlify when it's ready. A technical domain will be generated automatically, for instance: https://inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
The editor shows each and every entity that is present on the page.
Errors in the component code or pages can be tracked by viewing the debug console.
Tooltips in the code
The editor is here to help with property spelling — just start typing.
Synched pages and code editor
When you edit a page, the changes are applied to the code and vice versa.
Work on projects with your teammates using the Quarkly collaboration tool, just send them an invite.
Make every component work as a tag by selecting the desired "as" property value.
You can set desired attributes to elements in the code editor.
An individual property is provided for the "Image" element.
Set up custom icons for all devices and individual tile background color for Windows 10.
Open graph and meta tags
Your site will display appropriately thanks to these settings on social media and search engines.
To improve your site's SEO, make sure the URLs are readable by humans.
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