Landing page builder for no-code developers.
Meet Quarkly.
Choose from one of many pre-made blocks. Visual interface, adaptive design settings, code editor, React components, all possibilities of CSS. Publish your website online or export it to Github
Create Project
Full control over the design.
Primitives
A website is made up of fundamental elements similar to HTML tags. For example, Text, Image, and Вох.
Themes
You can use themes to create a consistent design for your site.
Extended Styling
Use animation, effects, and transformations to make your web page come to life.
Adaptive design
Fine-tune your adaptive design
Components
You can choose an element (or a group of elements) on the page and convert them into a component. Add copies to the page and they will inherit all the props.
Ready-made Content
Add maps, videos, pop-ups, and more to your site with ready-made blocks.
Customizing design with breakpoints
Rest assured your site is completely mobile-friendly by using different design solutions for elements at breakpoints.
Adding and editing breakpoints
You can customize the breakpoints in your project theme by adding or editing them.
Drag'n'Drop
You decide where to place the elements. Move them wherever you want, or nest them in other elements.
Multiselect
Use the multi-element selection tool to set styles, move, remove, or take other actions on multiple elements.
Text editor
Bold, italic, link, span, and other styles, all options to make your text stand out.
Deep select
Double clicking allows you to move up and down the element hierarchy, while holding Ctrl/Cmd lets you access deeper levels.
Support of Flexbox and Grid
Quarkly embraces the latest and greatest in frontend coding methods.
Configuring styles of pseudo-classes hover/active/focus, etc.
If you want to change the element look, for instance, how it appears on hover, enable "hover" and configure the desired props.
Google Fonts Connection
Make use of fonts from a collection that includes over 990 font families to give your website a more vibrant appearance.
Unsplash images
Browse Unsplash's collection of free images and choose directly from the Quarkly interface.
Props panel
Experience the ease of using categorized style and functional properties.
Layout
Under this section, you can find element display properties.
Typography
You can change text styles by using special properties in this section.
Indents
Here you can configure margins and paddings, which control the space around elements.
Background
Props for setting up element backgrounds can be found in this section.
Borders
In this section, you can adjust borders and border radius.
Position
This category contains settings for configuring the position and z-index of elements.
Transition
Elements can easily transition from one state to another thanks to this property.
Transform
This property will help you transform the element, for instance, rotate or zoom.
Development capabilities.
Supercharged.
Create custom React components using the code editor
In Quarkly, the code editor provides the ability to build unique React components and add them to the page.
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
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
When it's ready, publish your website on Netlify. It will automatically create a technical domain.
Modern built-in code editor
The editor shows each and every entity that is present on the page.
Debugger
Component code or page errors can be detected in the debug console.
Tooltips in the code
Start typing and the editor will give you a list of suggestions.
Synched pages and code editor
Whatever changes you make to the pages, they all will be displayed 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
Every component has the ability to act like a tag. Simply select the necessary value for the "as" field.
Schema.org
You can give elements the desired attributes through the code editor.
Image ALT
The "Image" element has a unique property.
Favicons
You can install distinctive icons for every device and a custom tile backdrop color for Windows with this functionality.
Open graph and meta tags
These settings will help your website look its best on social networks and in search engines.
User-friendly URL
To improve your site's SEO, make sure the URLs are readable by humans.
Robots.txt and sitemap.xml
Ready-made files available for customization and future editing.
Landing page builder for no-code developers.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project