Website maker for marketer.
Meet Quarkly.
Complete design control, supports Grid and Flexbox. Get all the power of graphic design tools and website builders. Unlimited customisation possibilities, no-code tools of a classic editor
Create Project
Full control over the design.
Primitives
Website is composed of basic components similar to HTML tags such as Text, Image, and Вох.
Themes
Create a consistent and professional-looking design with the help of themes.
Extended Styling
Make your websites more useful by adding original layouts, animations, effects, and transformations.
Adaptive design
Fine-tune your adaptive design
Components
On the page, you can select an element (or a collection of elements) and turn them into a component. All the props will be passed on to copies that are added to the page.
Ready-made Content
Place ready-made blocks on the page, for example, 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 change current breakpoints in the project theme or add new ones.
Drag'n'Drop
The choice is yours on how to arrange elements on the page — nest them, move them, or drop them in the desired area.
Multiselect
Use the multi-select feature to apply styles, move, remove, or perform other actions on multiple elements.
Text editor
You can bold or italicize part of the text; turn it into a link or a span; or apply any other style to it.
Deep select
Click twice to go up and down the hierarchy of elements. If you need to get inside the hierarchy, hold down Ctrl on Windows or Cmd on MacOs.
Support of Flexbox and Grid
At Quarkly, we support the latest and greatest in frontend coding.
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
Add a personal touch to your website with the use of 990+ font families available in the library.
Unsplash images
Use Unsplash, a top-rated free image stock, to search for images and select them directly from Quarkly.
Props panel
Take advantage of the categorized style and functional props.
Layout
You can find the element display properties under this section.
Typography
To change the style of your text, use special properties in this section.
Indents
Open these settings to configure margins and paddings.
Background
This section contains props that help you create element backgrounds.
Borders
Borders and border radius can be set up here.
Position
Element position and z-index settings can be adjusted in this category.
Transition
This property makes it possible for elements to move smoothly from one state to another.
Transform
Transform your element with ease using this property, 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
You can export your project as an archive using a create-react-app project if you want to finish it or host it on your server.
Code Editor
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
Create a GitHub repository for your project and commit changes as you work.
Publication on Netlify
When your site is complete, publish it on Netlify for an automatically generated technical domain, like https://inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
The editor displays all the entities of the page.
Debugger
You can track issues in the component code and pages with the aid of our debug console.
Tooltips in the code
Start typing and the editor will give you a list of suggestions.
Synched pages and code editor
All edits you apply to the pages are shown in the code and vice versa.
Incredible opportunities for business.
Collaboration
Share projects and work with your team members via Quarkly's collaboration tool. It's easy to use.
Semantic tags
Every component can act as a tag. Just choose the “as” property value that you need.
Schema.org
In the code editor, you can add attributes to elements as necessary.
Image ALT
The "Image" element has a unique property.
Favicons
Get creative with device icons and tile background color on Windows 10 with this exclusive setup feature.
Open graph and meta tags
These options are designed to ensure that your website appears properly in search engine results and on social media.
User-friendly URL
To improve your site's SEO, make sure the URLs are readable by humans.
Robots.txt and sitemap.xml
These files are automatically created. But you can edit them if necessary.
Website maker for marketer.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project