Web page editor for digital agencies.
Meet Quarkly.
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 CSS
Create Project
Ultimate control over the design.
Primitives
Website is composed of basic components similar to HTML tags such as Text, Image, and Вох.
Themes
Themes can help you design your website consistently.
Extended Styling
Add some flash to your web pages with stylish animations, effects, and transformations.
Adaptive design
Fine-tune your adaptive design
Components
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.
Ready-made Content
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.
Drag'n'Drop
You can move the elements wherever you want. Nest them in other elements, or leave them as they are.
Multiselect
Use the multi-select feature to apply styles, move, remove, or perform other actions on multiple elements.
Text editor
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.
Deep select
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 images
Unsplash is one of the most popular websites for free photos. You can look for and select images using the Quarkly interface.
Props panel
Enjoy a friendly interface with categorized styles and useful properties.
Layout
Here you can find element display properties.
Typography
To change the style of your text, use special properties in this section.
Indents
Here you will find the settings for margins and paddings.
Background
Props for setting up element backgrounds can be found in this section.
Borders
Find the options for borders and border radius configuration in this section.
Position
With this category, you can fine-tune element position and z-index settings.
Transition
This property helps an element move smoothly from one state to another.
Transform
This property can be used to rotate or zoom the element, for example.
Development capabilities.
Supercharged.
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
Import modules to your component from NPM with ease.
SEO
Optimize your site to promote it on search engines.
Export CRA
If you want to host your project on your server, you can export it into an archive with create-react-app.
Code Editor
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.
Debugger
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.
Stunning opportunities for business.
Collaboration
Share projects and work with your team members via Quarkly's collaboration tool. It's easy to use.
Semantic tags
You can make a component act as a tag by setting the “as” property to the desired value.
Schema.org
Assign attributes to elements with ease in the code editor.
Image ALT
This is an individual property that belongs to the “Image” element.
Favicons
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.
User-friendly URL
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.
Web page editor for digital agencies.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project