Pinegrow
Pinegrow
5.7

5.0

Pinegrow free download for Mac

Pinegrow

5.7
01 August 2019

Mockup and design web pages faster.

Overview

Pinegrow (was Pinegrow Web Designer) is desktop app that lets you mockup and design webpages faster with multi-page editing, CSS and LESS styling, and smart components for Bootstrap, Foundation, Angular JS, and WordPress.

What's new in Pinegrow

Version 5.7:

Note: Currently available for $74.25

Duplicate media queries:
  • Media queries can now be duplicated in Style panel by right-clicking on them and selecting Duplicate or Duplicate in…
  • Previously, only individual CSS rules could be duplicated.
  • Positioning duplicated or overridden rules has also been improved. When the original rule is located inside a media query, the new rule is placed outside of media query, right after it.
Lock all stylesheet children:
  • Pinegrow 5.6 introduced locked stylesheets. Now it is possible to quickly lock or unlock all sub-stylesheets by selecting “Lock / Unlock all children” in the Stylesheets dropdown.
Map urls in Master pages:
  • Master pages and the pages that use them can be located in different folders within the project. Pinegrow maps all urls (linked stylesheets, scripts, images…) in order to preserve link validity.
  • In Pinegrow 5.7 we changed the way how urls are mapped in order to avoid linking to wrong resources in cases where resources with same names exist within the project (for example, two index.html files).
  • Now, Pinegrow maps urls according to the position of the content page relative to its master page.
Components links:
  • The same url mapping process is now used when updating component instances. That makes it possible to define a component with links and to use it on pages that are located in different folders within the project.
  • Url mapping can be disabled on component definition by unchecking its Map urls setting.
Empty elements placeholders:
  • Pinegrow adds pg-empty-placeholder class to empty elements so that they can be visible on the page, for example to empty divs .
  • Now, any unneeded placeholder classes are removed when the page is saved, for example after adding content to the div in code editor.
  • Empty placeholders can be disabled in Settings. In that case all pg-empty-placeholder classes are removed when page is saved.
  • Note that the empty placeholder class can also be toggled for each page element in its Properties
Font Awesome update:
  • Font Awesome was updated to the latest version 5.9.0.
Bug fixes:
  • Pinegrow 5.7 comes with important bug fixes, most notably fixed drag & drop into the CSS grid. Hold CTRL (CMD on Mac) while dragging an element over a CSS grid to drop it into the selected CSS grid cell.
  • We also have a couple of WordPress Theme Builder bug fixes, including fixing the “Apply master page” command and correctly outputting term links with Post Tags & Categories smart action.

Requirements for Pinegrow

  • Intel 64
  • OS X 10.9.0 or later

17 Pinegrow Reviews

See all

Rate this app:

Tim27
11 May 2014

Most helpful

This interface can be a little daunting, but that's because of all the options available. This app is overall way better than Macaw and for much less money.
Like (5)
Version 1.108
Eviandem
27 July 2018
I switched from Flux to Pinegrow and got along well with Pinegrow from the beginning. The user interface is clear and concise, everything is where you need it. As of 4.9 there is also CSS Grid support, which even allows me as a beginner for my occasional HTML adjustments to achieve the desired results. And I hadn't found any bugs yet.
Like (2)
Version 4.8
Sandro-Bilbeisi
07 March 2018
I am using "PineGrow 4.5 PRO + WP" with e few extra goodies installed such as "WordPress Starter Theme for Pinegrow" and "BootStrap Blocks for Wordpress" ... it's saving me a lot of time and frustration ... it's an excellent tool for professionals but may have a slightly steep learning curve for beginners ...
Like (2)
Version 4.3
Scott-C-H-
04 September 2017
I've been keeping an eye on the development of Pinegrow as I remain curious about its progress. After all, Pinegrow's premise sounds rather appealing. Unfortunately, after many hours of testing the latest version (3.07 as of this writing), I became entirely convinced that it was NOT a good solution at this point.

Overall, it is extremely buggy. None of the bugs I noticed are major, but all kinds of cosmetic errors are everywhere, and they all slow you down. I've had so many "...huh?" moments that the user experience has become annoying and irritating. The learning curve is very steep when you try to figure out where all the GUI controls are. There are just so many options that even a simple CSS change sometimes causes quite a bit of scroll-and-hunt-down workflow frictions even when you already know where it is. I know HTML/CSS well enough that it's so much easier and faster just to spell out what I want using Emmet and snippets in other code editors.

Wordpress theme generator is very confusing to figure out as well. At this level of the learning curve, I can't help thinking that I would be better off just learning straight Wordpress coding and skip learning how to do it through Pinegrow altogether. It kind of works ok if you are inserting some basic stuff, but it quickly gets lost if you need to do a lot of custom if-then type loops.

It still can't fully render dynamic code inside Pinegrow. You have to resort back to a code editor if you need to handle PHP partials, existing Wordpress themes, and any other types of templates.

If you want a visual way of navigating code, I suggest you try Brackets.io. It's free, it's open source, and it works far better than Pinegrow. For example, if you are working with a straight HTML/CSS file for designing, you can open a Live Preview window, click where you want to edit, and the corresponding code gets highlighted in the main code window. The code is right there, unlike Pinegrow in which it hides the code under a very complicated and convoluted UI. You have to click around to get to it. So much for boasting how it is "code-friendly." Press Command-E and all the CSS styles affecting the element is exposed right on the spot for quick editing. Autocomplete is much smarter as well, so you can just "spell out your UI" faster than hunting down an element and dragging. There is a large extension community for Brackets.io, and you can find just about any niche functionalities you might want for your workflow.

I don't see how any serious developers with coding knowledge would consider using it. And I don't see how Pinegrow can help coding novices with such a convoluted UI and workflow with full of cosmetic bugs.
Like (2)
Version 3.07
Scott-C-H-
06 July 2017
v.3.0 gained visual CSS editing that is similar to that of Webflow's, except that Pinegrow is a desktop app and therefore it lets you work the same way with any HTML files.

Pinegrow is not an "all-or-nothing" tool. You can use it as a front-end IDE, you can use it as a rapid prototyping tool, or you can use it as "Chrome Dev Tools on steroid." You can use it alongside your favorite IDE/text editor of your choice. It is a great learning tool as well because you can manipulate a website both visually and via code, and you can see how each change affects the site real-time without having to save to file. You are NOT limited by what GUI gives you, either. Any obscure things that Pinegrow's visual editor doesn't cover, you can open the code right on the spot and edit directly in code. It's an editor for coders who want to turbocharge their workflow while retaining the total control of their code.

I used to be very skeptical of this type of tool, but I have to say that it's so much faster to whip up a prototype that I can convert to a production site later without a lot of double-work. It's a useful tool worth keeping in my toolbox.
Like (1)
Version 3.0
1 answer(s)
Scott-C-H-
Scott-C-H-
18 July 2017
Revised review: ★★✩✩✩

Update: I felt compelled to come back and say to my original v.3 review, "Not so fast." I tested it thoroughly during my 7-day trial period. The more I used it, the more it reminded me of my past review for v.2.

After testing thoroughly, I found it was still faster just to use a good code editor and work with HTML/CSS code directly even with its new CSS visual editor interface. Emmet makes HTML/CSS coding lightning-fast, and Chrome Dev Tools is more than enough to cover all the "visual manipulation" of HTML/CSS code. Sure, Pinegrow can build a WordPress theme from a static HTML page, but not without learning very convoluted steps in Pinegrow's GUI. Honestly, it was just as time-consuming as learning to code. It doesn't save time at all. I feel like I wasted time learning to use a proprietary tool to do something I should learn to code in a code editor in the first place.

And, the biggest irony I find whenever I try this type of tool is that you need to have a pretty good grasp of HTML/CSS coding process to get the most out of a tool such as this. And those who do have a good grasp of HTML/CSS coding will find this type of software rather convoluted and unnecessary. Macaw and Dreamweaver CC have both failed for this reason. I don't see why Pinegrow is different from them, at least so far.
Like (2)
Phaleron
01 July 2017
Wouldn't it be better to say that the WordPress version is $120, rather than $49?
Like
Version 3.0
pcampbell2010
24 March 2017
My favorite tool. Great product. I have been working in the web design business since the 1990s, progressing from simple HTML through responsive design. If my client ever asks for a tool that they can use to update and make small changes, this is the product I recommend.
Like
Version 2.95
Scott-C-H-
07 February 2017
The concept sounds good on surface, but in practice, it doesn’t render even a simple PHP page with <?php include(‘partial.php’); ?> correctly. I then have to run it on a dev server (MAMP, etc.) and resort to opening such page in Pinegrow via URL. But THEN, I can’t save anything I do in that mode. At that point, why bother? Chrome Dev Tools, Firebug, and even Safari’s Inspector can do most of what Pinegrow does, only with a more intuitive UI. Pinegrow can’t render anything other than straight HTML without dynamic codes, and I will have to do a lot of copying and pasting if I force it to work with such pages. How is that better than temporarily changing codes in Chrome Dev Tools, copy a block of changes or even the entire page of code right in the interface and paste it into the text editor of your choice to confirm the change? Besides that, you ought to be working directly with HTML/CSS code if you call yourself a web developer. No serious employers looking for a real developer would consider anyone who relies on a tool like this. You will be faster and more efficient in a long run if you learn to code. Get used to using the other kind of helper tools such as autocomplete and snippets. Find and know a couple of CSS frameworks intimately, and you will be a lot faster than searching for an element, dragging and dropping it all the time.
Like (4)
Version 2.95
4 answer(s)
Tim27
Tim27
03 July 2017
Is there any html editor that renders a PHP page without running MAMP or something like that? If you know of one please post here.
Like (1)
Mikael-B
Mikael-B
16 July 2017
@scott-c-h, Codekit https://www.macupdate.com/app/mac/46349/codekit
Like
Scott-C-H-
Scott-C-H-
18 July 2017
@Mikael-B, I use Atom + CodeKit + MAMP + Chrome Dev Tools for all web site design. I tried Macaw, Dreamweaver CC 2017 and Pinegrow in the past few months, and all of them utterly failed to meet my expectations. All of them sound good in theory and marketing, but none of them save time, and none of them work well without knowing HTML/CSS/Responsive design well. I find it much quicker and easier to just code and skip learning how to use a GUI abstraction layer such as Pinegrow. It is true especially when you need to work with dynamic codes.
Like (1)
Mikael-B
Mikael-B
19 July 2017
@scott-c-h-, Been there, done that (except for Atom) and came to the same conclusions as you.
Like (2)
acuriousmind
06 December 2016
If you're in the market for a professional web-tool, I highly recommend that you check Pinegrow out. One of the highlights is the excellent support for "hand-coded" HTML as it integrates very nicely with the Atom-editor. This integration means that you can navigate you web-layout visually and have the editor continuously jump to the selected element. There is a 30-days trial version and I can personally attest to the fact that should you decide to buy, the 30 days money back guarantee (in place at the time of this writing) is very real and can be utilized. (I used it to switch to a different "campaign"-offer) Check this tool out, if you're in the market for a tool in the category!
Like
Version 2.95
ash-f
05 December 2016
This is a professional tool. Please don't expect easiness to this. Comparing this with popular web builders on this site is like Oranges and Apples. Other tools can build web easily but it's too simple if you are a pro. i.e. Compiling css(sass/less)? Need Bootstrap/Foundation support? Need to hand codes html/css/javascript? This is the one. DreamWeaver is obsolete, but text editors are too awkward to design modern Web UI.
Like (1)
Version 2.95
Ollie1972
29 July 2016
This webbuilder isn't bad but Blocs2 surpassed it by miles now. Whatever you buy, TRY both first.
Like
Version 2.92
$99.00

5.0

Category: 
Developer Website: 
DownloadPurchase nowMacUpdateInstall with MacUpdate

Downloaded & Installed 7,519 times