Web page editor for marketing managers.
Meet Quarkly.
Choose from one of many pre-made blocks. All-in-one website builder on React — Quarkly. Use pre-made React components or build your own
Create Project
Ultimate control over the design.
Primitives
Primitive content components work like HTML tags. For example, Text, Image, and Вох.
Themes
It's simple to give your website a unified look with themes.
Extended Styling
Add a touch of flair to your site with unique layouts, eye-popping animations, and breathtaking transformations.
Adaptive design
Fine-tune your adaptive design
Components
On the Layer panel, choose the element or group of elements you want to convert to a component. All of the props will be inherited if you add duplicates of the components to the page.
Ready-made Content
Add premade blocks, including videos, pop-ups, maps, and more.
Customizing design with breakpoints
Your site works perfectly on mobile devices by using different design solutions for elements at breakpoints.
Adding and editing breakpoints
Use your own breakpoints or choose one of the ones that are already there.
Drag'n'Drop
Elements can be moved around, positioned however you like on the page, or nested inside other elements.
Multiselect
Use the multi-select feature to apply styles, move, remove, or perform other actions on multiple elements.
Text editor
You can make parts of your text bold or italic, or turn them into links. The font face, size, and color are also up to you.
Deep select
With the double click, you can go up and down the hierarchy of elements. If you need to get inside the hierarchy, hold down the Ctrl key on Windows and the Cmd key on MacOs.
Support of Flexbox and Grid
Quarkly supports the most advanced approaches to frontend coding.
Configuring styles of pseudo-classes hover/active/focus, etc.
To change the appearance of an element, such as changing its behavior on hover, just enable "hover" and set up the desired props.
Google Fonts Connection
Make your website look more vibrant by using fonts from a library with over 990 font families.
Unsplash images
Utilize Unsplash, one of the most widely used free image banks, to choose images directly from the Quarkly interface.
Props panel
Enjoy categorized styles and functional properties in a friendly interface.
Layout
Check out this section to use element display properties.
Typography
Use this section to customize text styles
Indents
These settings allow you to change margins and paddings.
Background
This section contains props for setting up element backgrounds.
Borders
The properties for borders and border radius can be found here.
Position
Customize element position and z-index through these settings in this category.
Transition
This property makes an element transit smoothly from one state to another.
Transform
This property allows you to transform the element, for example, rotate or zoom.
Development capabilities.
Supercharged.
Create custom React components using the code editor
You can build and add custom React components to your Quarkly pages using the code editor.
React.js
The pages are written in JSX code typical for React.js.
Hot import from NPM
Quickly import modules to your component from NPM when needed.
SEO
Optimize your site to promote it on search engines.
Export CRA
Simply export it as an archive using a create-react-app project if you need to finish or host your project on your own server.
Code Editor
Fine-tune elements in the code editor.
Export to Gatsby Project
Export your projects to Gatsby — one of the most famous static-site generation web frameworks
Pushing commits to your GitHub repository
Create a GitHub repository for your project and commit changes as you work.
Publication on Netlify
Once your site is ready, you can publish it on Netlify with a technical domain name like https://inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
You can keep an eye on every entity on the page in the Quarkly editor.
Debugger
When there are errors in the component code or pages, they can be seen in 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
When you make changes to the page, you can see those same edits reflected in the code.
Fantastic opportunities for business.
Collaboration
Take advantage of the Quarkly collaboration tool: work on a project together with your teammates, just send them an invite.
Semantic tags
Component-to-tag transformation made simple with the right "as" property value selection.
Schema.org
In the code editor, you can give items the desired attributes.
Image ALT
A special property of the “Image” element.
Favicons
Set up unique Windows tile background colors and exclusive icons for multiple devices.
Open graph and meta tags
Use these settings to ensure that your website appears as intended on social media and in search results.
User-friendly URL
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
These files are automatically created. But you can edit them if necessary.
Web page editor for marketing managers.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project