I'm looking for a method of designing a website that detects the following; 1: Whether the OS is desktop or Mobile 2: If mobile, iOS/Windows or Android? 3: Resolution What are the best ways to go about this? and possibly integrate with a current desktop wordpress theme?
An easy way to do this is with a media query. Media queries are CSS rules that come into place when a condition is true. I'm not sure that this would work for different OS's but definitely works when, say, the screen size (Viewport) drops below a specific point.
Media queries do not detect OS. They only can detect the media being used and the screen sizes. If you need to know the statistics of who is using what, you can do that via Google analytic. I wouldn't recommend creating different designs based on OS. They are always upgrading and changing. A screen size based media query is a much better approach. Many WP themes already have media queries as part of their coding.
If you're just wondering what operating systems and browsers your users are using, you can use Google Analytics for that. If you're meaning that you want your website to detect these things in order for your site to respond to the screen size/resolution, then you're going to want media queries for this.
I think your intent is unclear -- are you looking for said information for tracking purposes, or are you literally looking at it for design purposes? Generally speaking if for design, then I think the question is the antithesis of rational accessible site design. It's the same concept as browser sniffing, which is a half-assed way of building sites that sane developers have shunned almost since it was introduced. It's ok to detect capabilities - like screen size with media queries; but targeting specific devices is just making sure anyone on anything different is left out in the cold.