Looking for Dorik alternatives?
Meet Quarkly.
Create your website from scratch or ready-to-use templates. Completely free — you should try it now. Complete design control, supports Grid and Flexbox
Create Project
Ultimate control over the design.
Primitives
Basic components which are similar to HTML tags like Text, Image, Box, and others.
Themes
With themes, you can craft a consistent site design
Extended Styling
Now your website will be noticed! Use our unique animations, catchy layouts, and transformations.
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
Place ready-made blocks on the page, for example, maps, videos, pop-ups, and more
Customizing design with breakpoints
Your website will automatically adjust to different screen sizes, with 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 can place elements wherever you want on a page — that's up to you. You can drop them in the desired area, or nest them in other ones.
Multiselect
You can choose multiple elements, set their styles, move to another place, delete, and more.
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
If you need to go up and down the hierarchy of elements, double-click them. If you want to dive into 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 way an element looks, such as its appearance on hover, enable the "hover" prop and set other desired props.
Google Fonts Connection
If you want your site design to look more professional, consider using a library of more than 990 font families.
Unsplash images
Make use of Unsplash, one of the most popular free image stocks where you can select images directly from the Quarkly interface
Props panel
Enjoy categorized style and functional properties.
Layout
Check out this section to use element display properties.
Typography
To alter the appearance of your text, use the properties in this section.
Indents
These settings allow you to change margins and paddings.
Background
In this section, you can find props for element backgrounds.
Borders
This section allows you to adjust borders and border radius.
Position
This category helps you configure the position and z-index settings of elements.
Transition
This property makes an element transition smoothly from one state to another.
Transform
With this property, you can transform the element, for instance, rotate or zoom.
Development capabilities.
Supercharged.
Building custom React components in the code editor
You can make your own React components in the Quarkly code editor and add them to the page.
React.js
The pages are written in JSX code typical for React.js
Hot import from NPM
Importing modules to your component from NPM has never been easier.
SEO
Optimize your site to promote it on search engines
Export CRA
There is just one thing to do if you want to finish or host your project on your server: export it into an archive with a create-react-app project!
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
You can create a GitHub repository for your project and commit changes.
Publication on Netlify
Publish your site on Netlify once it's ready. A technical domain will be created automatically for it, for example: https://inspiring-beaver-d128ed.netlify.app.
Modern built-in code editor
The editor displays all the entities of the page.
Debugger
When there are errors in the component code or pages, they can be seen in the debug console.
Tips in the code
If you're not sure how to spell a property, type the first few letters and the editor will complete it for you.
Synched pages and code editor
All edits you apply to the pages are shown in the code and vice versa.
Stunning opportunities for business.
Work together as a team
Take advantage of the Quarkly collaboration tool: work on a project together with your teammates, just send them an invite.
Semantic tags
Every component can act as a tag. Just choose the “as” property value that you need.
Schema.org
You can specify desired attributes for elements in the code editor.
Image ALT
A special property of the “Image” element.
Favicons
Set up custom icons for all devices and individual tile background color for Windows 10.
Open graph and meta tags
These settings will help your site display correctly on social networks and in search engines.
User-friendly URL
Clean URLs will help you improve your site's SEO.
Robots.txt and sitemap.xml
These files are created automatically. But you can edit them as you think they fit in the future.
Try it for free.
We provide Quarkly for free as long as we can, and then the lowest price among competitors.
Create project