All-in-one website builder on React — Quarkly. Choose from one of many pre-made blocks. Publish your website online or export it to GithubCreate Project
These are the most basic components similar to HTML tags: Text, Image, Box, and others.
Themes make it easy to give your website a unified appearance.
With stylish animations, effects, and transformations, you can make your web page more exciting.
Fine-tune your adaptive design
Transform an element or group of elements on the page or Layer panel into a component. Add copies to the page and they will inherit all properties.
Add premade blocks, including videos, pop-ups, maps, and more.
Customizing design with breakpoints
You can make sure your site is mobile-friendly by designing different solutions for elements at breakpoints.
Adding and editing breakpoints
You can use your own custom breakpoints, or select one of the existing ones.
Drag and drop elements to arrange them on the page, or nest them in other elements.
You have the option to format multiple elements at once, move multiple elements around the document, or remove multiple elements from their current position.
A portion of the text can be changed by applying any style, making it bold or italic, linking to it or making it a span.
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.
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.
Browse the Unsplash image collection and choose those you need directly from the Quarkly interface.
Enjoy categorized style and functional properties.
You can find the element display properties under this section.
Use the properties in this section to change the text's appearance.
Margin and padding configuration is available here.
Here you'll find some props to help you set up element backgrounds.
Here you can configure border and border radius.
You can change the element position and z-index settings in this category.
This property helps an element move smoothly from one state to another.
This property can be used to rotate or zoom the element, for example.
Create custom React components using the code editor
You can make your own React components in the Quarkly code editor and add them to the page.
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.
Optimize your site to promote it on search engines.
If you want to finish or host your project on your server, there is only one thing you need to do: export it as an archive using a create-react-app project.
Fine-tune elements in the code editor.
Export to Gatsby Project
Your projects can be easily exported to Gatsby, a well-liked 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 Quarkly editor contains all of the page's entities.
Errors in the component code or pages can be tracked by viewing the debug console.
Tooltips in the code
If you need help when spelling a property, start typing and the editor will auto-complete what you've written.
Synched pages and code editor
Changes made to a page are reflected in the code and vice versa.
Make teamwork a breeze with the Quarkly collaboration tool, just send an invite to your coworkers.
You can use each component as a tag. Just choose the needed value of the “as” property.
You can customize elements with the necessary attributes in the code editor.
A unique attribute that belongs to the "Image" element.
Set up unique Windows tile background colors and exclusive icons for multiple devices.
Open graph and meta tags
Set these options appropriately to ensure that your website appears as intended in social media and search engine results.
Create user-friendly URLs to boost the usability of the resource and the ranking of your site in the search engines.
Robots.txt and sitemap.xml
You can further change these automatically generated files.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.Create project