Publish your website online or export it to Github. All-in-one website builder on React — Quarkly. Visual interface, adaptive design settings, code editor, React components, all possibilities of CSSCreate Project
Website is composed of basic components similar to HTML tags such as Text, Image, and Вох.
Themes can help you design your website consistently.
Add some flash to your web pages with stylish animations, effects, and transformations.
Fine-tune your adaptive design
Any combination of elements on the page or in a layer can be used to create reusable components. The component inherits all of its original properties when you add it to a page.
Take advantage of the ready-made blocks such as maps, videos, pop-ups, and more
Customizing design with breakpoints
By creating various solutions for elements at breakpoints, you can ensure that your website is mobile-friendly.
Adding and editing breakpoints
You can use your own custom breakpoints, or select one of the existing ones.
You can move the elements wherever you want. Nest them in other elements, or leave them as they are.
Use the multi-select feature to apply styles, move, remove, or perform other actions on multiple elements.
You can edit part of the text making it bold or italic, turning it into a link or converting to span, as well as appyling any style to it.
Double-clicking the hierarchy of elements will take you up and down the element structure. If you want to get inside the structure, hold down the Ctrl key on Windows or the Cmd key on MacOs.
Support of Flexbox and Grid
We're excited to offer you the best frontend coding practices around.
Configuring styles of pseudo-classes hover/active/focus, etc.
To change the way an element looks, such as its appearance on hover, enable the "hover" prop and set other desired props.
Google Fonts Connection
Use the library of over 990 font families to make your site look more beautiful
Unsplash is one of the most popular websites for free photos. You can look for and select images using the Quarkly interface.
Enjoy a friendly interface with categorized styles and useful properties.
Here you can find element display properties.
To change the style of your text, use special properties in this section.
Here you will find the settings for margins and paddings.
Props for setting up element backgrounds can be found in this section.
Find the options for borders and border radius configuration in this section.
With this category, you can fine-tune element position and z-index settings.
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
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
Import modules to your component from NPM with ease.
Optimize your site to promote it on search engines.
If you want to host your project on your server, you can export it into an archive with create-react-app.
Fine-tune elements in the code editor.
Export to Gatsby Project
You can export your projects to Gatsby — one of the best open source Static Site Generators.
Pushing commits to your GitHub repository
If you need, you can create a GitHub repository for your projects and commit changes.
Publication on Netlify
Once everything is complete, publish your website on Netlify using a technical domain name.
Modern built-in code editor
The editor displays every entity on the page.
To find faults in the component code and pages, use our debug console.
Tooltips in the code
Start typing and the editor will give you a list of suggestions.
Synched pages and code editor
Any adjustments you make to the pages will also be reflected in the code, and vice versa.
Share projects and work with your team members via Quarkly's collaboration tool. It's easy to use.
You can make a component act as a tag by setting the “as” property to the desired value.
Assign attributes to elements with ease in the code editor.
This is an individual property that belongs to the “Image” element.
Customize your device icons and set individual tile background color on Windows 10.
Open graph and meta tags
Use these settings for the correct display of your site on social networks and in search engines.
This feature allows you to set friendly URLs for your pages.
Robots.txt and sitemap.xml
These files are automatically generated. You can edit these files to suit your needs for the future.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.Create project