Project G-Assist — available through the NVIDIA App — is an experimental AI assistant that helps tune, control and optimize NVIDIA GeForce RTX systems. NVIDIA’s Plug and Play: Project G-Assist Plug-In Hackathon — running virtually through Wednesday, July 16 — invites the community to explore AI and build custom G-Assist plug-ins for a chance to win prizes and be featured on NVIDIA social media channels. G-Assist allows users to control their RTX GPU and other system settings using natural language, thanks to a small language model that runs on device. It can be used from the NVIDIA Overlay in the NVIDIA App without needing to tab out or switch programs. Users can expand its capabilities via plug-ins and even connect it to agentic frameworks such as Langflow. Below, find popular G-Assist plug-ins, hackathon details and tips to get started. Plug-In and Win Join the hackathon by registering and checking out the curated technical resources. G-Assist plug-ins can be built in several ways, including with Python for rapid development, with C++ for performance-critical apps and with custom system interactions for hardware and operating system automation. For those that prefer vibe coding, the G-Assist Plug-In Builder — a ChatGPT-based app that allows no-code or low-code development with natural language commands — makes it easy for enthusiasts to start creating plug-ins. To submit an entry, participants must provide a GitHub repository, including source code file (plugin.py), requirements.txt, manifest.json, config.json (if applicable), a plug-in executable file and READme code. Then, submit a video — between 30 seconds and two minutes — showcasing the plug-in in action. Finally, hackathoners must promote their plug-in using #AIonRTXHackathon on a social media channel: Instagram, TikTok or X. Submit projects via this form by Wednesday, July 16. Judges will assess plug-ins based on three main criteria: 1) innovation and creativity, 2) technical execution and integration, reviewing technical depth, G-Assist integration and scalability, and 3) usability and community impact, aka how easy it is to use the plug-in. Winners will be selected on Wednesday, Aug. 20. First place will receive a GeForce RTX 5090 laptop, second place a GeForce RTX 5080 GPU and third a GeForce RTX 5070 GPU. These top three will also be featured on NVIDIA’s social media channels, get the opportunity to meet the NVIDIA G-Assist team and earn an NVIDIA Deep Learning Institute self-paced course credit. Project G-Assist requires a GeForce RTX 50, 40 or 30 Series Desktop GPU with at least 12GB of VRAM, Windows 11 or 10 operating system, a compatible CPU (Intel Pentium G Series, Core i3, i5, i7 or higher; AMD FX, Ryzen 3, 5, 7, 9, Threadripper or higher), specific disk space requirements and a recent GeForce Game Ready Driver or NVIDIA Studio Driver. Plug-In(spiration) Explore open-source plug-in samples available on GitHub, which showcase the diverse ways on-device AI can enhance PC and gaming workflows. Popular plug-ins include: Google Gemini: Enables search-based queries using Google Search integration and large language model-based queries using Gemini capabilities in real time without needing to switch programs from the convenience of the NVIDIA App Overlay. Discord: Enables users to easily share game highlights or messages directly to Discord servers without disrupting gameplay. IFTTT: Lets users create automations across hundreds of compatible endpoints to trigger IoT routines — such as adjusting room lights and smart shades, or pushing the latest gaming news to a mobile device. Spotify: Lets users control Spotify using simple voice commands or the G-Assist interface to play favorite tracks and manage playlists. Twitch: Checks if any Twitch streamer is currently live and can access detailed stream information such as titles, games, view counts and more. Get G-Assist(ance)  Join the NVIDIA Developer Discord channel to collaborate, share creations and gain support from fellow AI enthusiasts and NVIDIA staff. Save the date for NVIDIA’s How to Build a G-Assist Plug-In webinar on Wednesday, July 9, from 10-11 a.m. PT, to learn more about Project G-Assist capabilities, discover the fundamentals of building, testing and deploying Project G-Assist plug-ins, and participate in a live Q&A session. Explore NVIDIA’s GitHub repository, which provides everything needed to get started developing with G-Assist, including sample plug-ins, step-by-step instructions and documentation for building custom functionalities. Learn more about the ChatGPT Plug-In Builder to transform ideas into functional G-Assist plug-ins with minimal coding. The tool uses OpenAI’s custom GPT builder to generate plug-in code and streamline the development process. NVIDIA’s technical blog walks through the architecture of a G-Assist plug-in, using a Twitch integration as an example. Discover how plug-ins work, how they communicate with G-Assist and how to build them from scratch. Each week, the RTX AI Garage blog series features community-driven AI innovations and content for those looking to learn more about NVIDIA NIM microservices and AI Blueprints, as well as building AI agents, creative workflows, digital humans, productivity apps and more on AI PCs and workstations.  Plug in to NVIDIA AI PC on Facebook, Instagram, TikTok and X — and stay informed by subscribing to the RTX AI PC newsletter. Follow NVIDIA Workstation on LinkedIn and X.  See notice regarding software product information.

Donald Trump’s military parade in Washington this weekend — a show of force in the capital that just happens to take place on the president’s birthday — smacks of authoritarian Dear Leader-style politics (even though Trump actually got the idea after attending the 2017 Bastille Day parade in Paris).Yet as disconcerting as the imagery of tanks rolling down Constitution Avenue will be, it’s not even close to Trump’s most insidious assault on the US military’s historic and democratically essential nonpartisan ethos.In fact, it’s not even the most worrying thing he’s done this week.On Tuesday, the president gave a speech at Fort Bragg, an Army base home to Special Operations Command. While presidential speeches to soldiers are not uncommon — rows of uniformed troops make a great backdrop for a foreign policy speech — they generally avoid overt partisan attacks and campaign-style rhetoric. The soldiers, for their part, are expected to be studiously neutral, laughing at jokes and such, but remaining fully impassive during any policy conversation.That’s not what happened at Fort Bragg. Trump’s speech was a partisan tirade that targeted “radical left” opponents ranging from Joe Biden to Los Angeles Mayor Karen Bass. He celebrated his deployment of Marines to Los Angeles, proposed jailing people for burning the American flag, and called on soldiers to be “aggressive” toward the protesters they encountered.The soldiers, for their part, cheered Trump and booed his enemies — as they were seemingly expected to. Reporters at Military.com, a military news service, uncovered internal communications from 82nd Airborne leadership suggesting that the crowd was screened for their political opinions.“If soldiers have political views that are in opposition to the current administration and they don’t want to be in the audience then they need to speak with their leadership and get swapped out,” one note read.To call this unusual is an understatement. I spoke with four different experts on civil-military relations, two of whom teach at the Naval War College, about the speech and its implications. To a person, they said it was a step towards politicizing the military with no real precedent in modern American history.“That is, I think, a really big red flag because it means the military’s professional ethic is breaking down internally,” says Risa Brooks, a professor at Marquette University. “Its capacity to maintain that firewall against civilian politicization may be faltering.”This may sound alarmist — like an overreading of a one-off incident — but it’s part of a bigger pattern. The totality of Trump administration policies, ranging from the parade in Washington to the LA troop deployment to Secretary of Defense Pete Hegseth’s firing of high-ranking women and officers of color, suggests a concerted effort to erode the military’s professional ethos and turn it into an institution subservient to the Trump administration’s whims. This is a signal policy aim of would-be dictators, who wish to head off the risk of a coup and ensure the armed forces’ political reliability if they are needed to repress dissent in a crisis.Steve Saideman, a professor at Carleton University, put together a list of eight different signs that a military is being politicized in this fashion. The Trump administration has exhibited six out of the eight.“The biggest theme is that we are seeing a number of checks on the executive fail at the same time — and that’s what’s making individual events seem more alarming than they might otherwise,” says Jessica Blankshain, a professor at the Naval War College (speaking not for the military but in a personal capacity).That Trump is trying to politicize the military does not mean he has succeeded. There are several signs, including Trump’s handpicked chair of the Joint Chiefs repudiating the president’s claims of a migrant invasion during congressional testimony, that the US military is resisting Trump’s politicization.But the events in Fort Bragg and Washington suggest that we are in the midst of a quiet crisis in civil-military relations in the United States — one whose implications for American democracy’s future could well be profound.The Trump crisis in civil-military relations, explainedA military is, by sheer fact of its existence, a threat to any civilian government. If you have an institution that controls the overwhelming bulk of weaponry in a society, it always has the physical capacity to seize control of the government at gunpoint. A key question for any government is how to convince the armed forces that they cannot or should not take power for themselves.Democracies typically do this through a process called “professionalization.” Soldiers are rigorously taught to think of themselves as a class of public servants, people trained to perform a specific job within defined parameters. Their ultimate loyalty is not to their generals or even individual presidents, but rather to the people and the constitutional order.Samuel Huntington, the late Harvard political scientist, is the canonical theorist of a professional military. In his book The Soldier and the State, he described optimal professionalization as a system of “objective control”: one in which the military retains autonomy in how they fight and plan for wars while deferring to politicians on whether and why to fight in the first place. In effect, they stay out of the politicians’ affairs while the politicians stay out of theirs.The idea of such a system is to emphasize to the military that they are professionals: Their responsibility isn’t deciding when to use force, but only to conduct operations as effectively as possible once ordered to engage in them. There is thus a strict firewall between military affairs, on the one hand, and policy-political affairs on the other.Typically, the chief worry is that the military breaches this bargain: that, for example, a general starts speaking out against elected officials’ policies in ways that undermine civilian control. This is not a hypothetical fear in the United States, with the most famous such example being Gen. Douglas MacArthur’s insubordination during the Korean War. Thankfully, not even MacArthur attempted the worst-case version of military overstep — a coup.But in backsliding democracies like the modern United States, where the chief executive is attempting an anti-democratic power grab, the military poses a very different kind of threat to democracy — in fact, something akin to the exact opposite of the typical scenario.In such cases, the issue isn’t the military inserting itself into politics but rather the civilians dragging them into it in ways that upset the democratic political order. The worst-case scenario is that the military acts on presidential directives to use force against domestic dissenters, destroying democracy not by ignoring civilian orders, but by following them.There are two ways to arrive at such a worst-case scenario, both of which are in evidence in the early days of Trump 2.0.First is politicization: an intentional attack on the constraints against partisan activity inside the professional ranks.Many of Pete Hegseth’s major moves as secretary of defense fit this bill, including his decisions to fire nonwhite and female generals seen as politically unreliable and his effort to undermine the independence of the military’s lawyers. The breaches in protocol at Fort Bragg are both consequences and causes of politicization: They could only happen in an environment of loosened constraint, and they might encourage more overt political action if gone unpunished.The second pathway to breakdown is the weaponization of professionalism against itself. Here, Trump exploits the military’s deference to politicians by ordering it to engage in undemocratic (and even questionably legal) activities. In practice, this looks a lot like the LA deployments, and, more specifically, the lack of any visible military pushback. While the military readily agreeing to deployments is normally a good sign — that civilian control is holding — these aren’t normal times. And this isn’t a normal deployment, but rather one that comes uncomfortably close to the military being ordered to assist in repressing overwhelmingly peaceful demonstrations against executive abuses of power.“It’s really been pretty uncommon to use the military for law enforcement,” says David Burbach, another Naval War College professor (also speaking personally). “This is really bringing the military into frontline law enforcement when. … these are really not huge disturbances.”This, then, is the crisis: an incremental and slow-rolling effort by the Trump administration to erode the norms and procedures designed to prevent the military from being used as a tool of domestic repression. Is it time to panic?Among the experts I spoke with, there was consensus that the military’s professional and nonpartisan ethos was weakening. This isn’t just because of Trump, but his terms — the first to a degree, and now the second acutely — are major stressors.Yet there was no consensus on just how much military nonpartisanship has eroded — that is, how close we are to a moment when the US military might be willing to follow obviously authoritarian orders.For all its faults, the US military’s professional ethos is a really important part of its identity and self-conception. While few soldiers may actually read Sam Huntington or similar scholars, the general idea that they serve the people and the republic is a bedrock principle among the ranks. There is a reason why the United States has never, in over 250 years of governance, experienced a military coup — or even come particularly close to one.In theory, this ethos should also galvanize resistance to Trump’s efforts at politicization. Soldiers are not unthinking automatons: While they are trained to follow commands, they are explicitly obligated to refuse illegal orders, even coming from the president. The more aggressive Trump’s efforts to use the military as a tool of repression gets, the more likely there is to be resistance.Or, at least theoretically.The truth is that we don’t really know how the US military will respond to a situation like this. Like so many of Trump’s second-term policies, their efforts to bend the military to their will are unprecedented — actions with no real parallel in the modern history of the American military. Experts can only make informed guesses, based on their sense of US military culture as well as comparisons to historical and foreign cases.For this reason, there are probably only two things we can say with confidence.First, what we’ve seen so far is not yet sufficient evidence to declare that the military is in Trump’s thrall. The signs of decay are too limited to ground any conclusions that the longstanding professional norm is entirely gone.“We have seen a few things that are potentially alarming about erosion of the military’s non-partisan norm. But not in a way that’s definitive at this point,” Blankshain says.Second, the stressors on this tradition are going to keep piling on. Trump’s record makes it exceptionally clear that he wants the military to serve him personally — and that he, and Hegseth, will keep working to make it so. This means we really are in the midst of a quiet crisis, and will likely remain so for the foreseeable future.“The fact that he’s getting the troops to cheer for booing Democratic leaders at a time when there’s actually [a deployment to] a blue city and a blue state…he is ordering the troops to take a side,” Saideman says. “There may not be a coherent plan behind this. But there are a lot of things going on that are all in the same direction.”See More: Politics

Greg Touhill, director of the Software Engineering’s Institute’s (SEI’s) Computer Emergency Response Team (CERT) division is an atypical technology leader. For one thing, he’s been in tech and other leadership positions that span the US Air Force, the US government, the private sector and now SEI’s CERT. More importantly, he’s been a major force in the cybersecurity realm, making the world a safer place and even saving lives. Touhill earned a bachelor’s degree from the Pennsylvania State University, a master’s degree from the University of Southern California, a master’s degree from the Air War College, was a senior executive fellow at the Harvard University Kennedy School of Government and completed executive education studies at the University of North Carolina. “I was a student intern at Carnegie Mellon, but I was going to college at Penn State and studying chemical engineering. As an Air Force ROTC scholarship recipient, I knew I was going to become an Air Force officer but soon realized that I didn’t necessarily want to be a chemical engineer in the Air Force,” says Touhill. “Because I passed all the mathematics, physics, and engineering courses, I ended up becoming a communications, electronics, and computer systems officer in the Air Force. I spent 30 years, one month and three days on active duty in the United States Air Force, eventually retiring as a brigadier general and having done many different types of jobs that were available to me within and even beyond my career field.” Related:Specifically, he was an operational commander at the squadron, group, and wing levels. For example, as a colonel, Touhill served as director of command, control, communications and computers (C4) for the United States Central Command Forces, then he was appointed chief information officer and director, communications and information at Air Mobility Command. Later, he served as commander, 81st Training Wing at Kessler Air Force Base where he was promoted to brigadier general and commanded over 12,500 personnel. After that, he served as the senior defense officer and US defense attaché at the US Embassy in Kuwait, before concluding his military career as the chief information officer and director, C4 systems at the US Transportation Command, one of 10 US combatant commands, where he and his team were awarded the NSA Rowlett Award for the best cybersecurity program in the government. While in the Air Force, Touhill received numerous awards and decorations including the Bronze Star medal and the Air Force Science and Engineering Award. He is the only three-time recipient of the USAF C4 Professionalism Award. Related:Greg Touhill“I got to serve at major combatant commands, work with coalition partners from many different countries and represented the US as part of a diplomatic mission to Kuwait for two years as the senior defense official at a time when America was withdrawing forces out of Iraq. I also led the negotiation of a new bilateral defense agreement with the Kuwaitis,” says Touhill. “Then I was recruited to continue my service and was asked to serve as the deputy assistant secretary of cybersecurity and communications at the Department of Homeland Security, where I ran the operations of what is now known as the Cybersecurity and Infrastructure Security Agency. I was there at a pivotal moment because we were building up the capacity of that organization and setting the stage for it to become its own agency.” While at DHS, there were many noteworthy breaches including the infamous US Office of People Management (OPM) breach. Those events led to Obama’s visit to the National Cybersecurity and Communications Integration Center.  “I got to brief the president on the state of cybersecurity, what we had seen with the OPM breach and some other deficiencies,” says Touhill. “I was on the federal CIO council as the cybersecurity advisor to that since I’d been a federal CIO before and I got to conclude my federal career by being the first United States government chief information security officer. From there, I pivoted to industry, but I also got to return to Carnegie Mellon as a faculty member at Carnegie Mellon’s Heinz College, where I've been teaching since January 2017.” Related:Touhill has been involved in three startups, two of which were successfully acquired. He also served on three Fortune 100 advisory boards and on the Information Systems Audit and Control Association board, eventually becoming its chair for a term during the seven years he served there. Touhill just celebrated his fourth year at CERT, which he considers the pinnacle of the cybersecurity profession and everything he’s done to date. “Over my career I've led teams that have done major software builds in the national security space. I've also been the guy who's pulled cables and set up routers, hubs and switches, and I've been a system administrator. I've done everything that I could do from the keyboard up all the way up to the White House,” says Touhill. “For 40 years, the Software Engineering Institute has been leading the world in secure by design, cybersecurity, software engineering, artificial intelligence and engineering, pioneering best practices, and figuring out how to make the world a safer more secure and trustworthy place. I’ve had a hand in the making of today’s modern military and government information technology environment, beginning as a 22-year-old lieutenant, and hope to inspire the next generation to do even better.” What ‘Success’ Means Many people would be satisfied with their careers as a brigadier general, a tech leader, the White House’s first anything, or working at CERT, let alone running it. Touhill has spent his entire career making the world a safer place, so it’s not surprising that he considers his greatest achievement saving lives. “In the Middle East and Iraq, convoys were being attacked with improvised explosive devices. There were also ‘direct fire’ attacks where people are firing weapons at you and indirect fire attacks where you could be in the line of fire,” says Touhill. “The convoys were using SINCGARS line-of-site walkie-talkies for communications that are most effective when the ground is flat, and Iraq is not flat. As a result, our troops were at risk of not having reliable communications while under attack. As my team brainstormed options to remedy the situation, one of my guys found some technology, about the size of an iPhone, that could covert a radio signal, which is basically a waveform, into a digital pulse I could put on a dedicated network to support the convoy missions.” For $11 million, Touhill and his team quickly architected, tested, and fielded the Radio over IP network (aka “Ripper Net”) that had a 99% reliability rate anywhere in Iraq. Better still, convoys could communicate over the network using any radios. That solution saved a minimum of six lives. In one case, the hospital doctor said if the patient had arrived five minutes later, he would have died. Sage Advice Anyone who has ever spent time in the military or in a military family knows that soldiers are very well disciplined, or they wash out. Other traits include being physically fit, mentally fit, and achieving balance in life, though that’s difficult to achieve in combat. Still, it’s a necessity. “I served three and a half years down range in combat operations. My experience taught me you could be doing 20-hour days for a year or two on end. If you haven’t built a good foundation of being disciplined and fit, it impacts your ability to maintain presence in times of stress, and CISOs work in stressful situations,” says Touhill. “Staying fit also fortifies you for the long haul, so you don’t get burned out as fast.” Another necessary skill is the ability to work well with others.  “Cybersecurity is an interdisciplinary practice. One of the great joys I have as CERT director is the wide range of experts in many different fields that include software engineers, computer engineers, computer scientists, data scientists, mathematicians and physicists,” says Touhill. “I have folks who have business degrees and others who have philosophy degrees. It's really a rich community of interests all coming together towards that common goal of making the world a safer, more secure and more trusted place in the cyber domain. We’re are kind of like the cyber neighborhood watch for the whole world.” He also says that money isn’t everything, having taken a pay cut to go from being an Air Force brigadier general to the deputy assistant secretary of the Department of Homeland Security . “You’ll always do well if you pick the job that matters most. That’s what I did, and I’ve been rewarded every step,” says Touhill.  The biggest challenge he sees is the complexity of cyber systems and software, which can have second, third, and fourth order effects.  “Complexity raises the cost of the attack surface, increases the attack surface, raises the number of vulnerabilities and exploits human weaknesses,” says Touhill. “The No. 1 thing we need to be paying attention to is privacy when it comes to AI because AI can unearth and discover knowledge from data we already have. While it gives us greater insights at greater velocities, we need to be careful that we take precautions to better protect our privacy, civil rights and civil liberties.” 

In a previous article, we looked at some practical examples of how to code SVG by hand. In that guide, we covered the basics of the SVG elements rect, circle, ellipse, line, polyline, and polygon (and also g). This time around, we are going to tackle a more advanced topic, the absolute powerhouse of SVG elements: path. Don’t get me wrong; I still stand by my point that image paths are better drawn in vector programs than coded (unless you’re the type of creative who makes non-logical visual art in code — then go forth and create awe-inspiring wonders; you’re probably not the audience of this article). But when it comes to technical drawings and data visualizations, the path element unlocks a wide array of possibilities and opens up the world of hand-coded SVGs. The path syntax can be really complex. We’re going to tackle it in two separate parts. In this first installment, we’re learning all about straight and angular paths. In the second part, we’ll make lines bend, twist, and turn. Required Knowledge And Guide Structure Note: If you are unfamiliar with the basics of SVG, such as the subject of viewBox and the basic syntax of the simple elements (rect, line, g, and so on), I recommend reading my guide before diving into this one. You should also familiarize yourself with <text> if you want to understand each line of code in the examples. Before we get started, I want to quickly recap how I code SVG using JavaScript. I don’t like dealing with numbers and math, and reading SVG Code with numbers filled into every attribute makes me lose all understanding of it. By giving coordinates names and having all my math easy to parse and write out, I have a much better time with this type of code, and I think you will, too. The goal of this article is more about understanding path syntax than it is about doing placement or how to leverage loops and other more basic things. So, I will not run you through the entire setup of each example. I’ll instead share snippets of the code, but they may be slightly adjusted from the CodePen or simplified to make this article easier to read. However, if there are specific questions about code that are not part of the text in the CodePen demos, the comment section is open. To keep this all framework-agnostic, the code is written in vanilla JavaScript (though, really, TypeScript is your friend the more complicated your SVG becomes, and I missed it when writing some of these). Setting Up For Success As the path element relies on our understanding of some of the coordinates we plug into the commands, I think it is a lot easier if we have a bit of visual orientation. So, all of the examples will be coded on top of a visual representation of a traditional viewBox setup with the origin in the top-left corner (so, values in the shape of 0 0 ${width} ${height}. I added text labels as well to make it easier to point you to specific areas within the grid. Please note that I recommend being careful when adding text within the <text> element in SVG if you want your text to be accessible. If the graphic relies on text scaling like the rest of your website, it would be better to have it rendered through HTML. But for our examples here, it should be sufficient. So, this is what we’ll be plotting on top of: See the Pen SVG Viewbox Grid Visual [forked] by Myriam. Alright, we now have a ViewBox Visualizing Grid. I think we’re ready for our first session with the beast. Enter path And The All-Powerful d Attribute The <path> element has a d attribute, which speaks its own language. So, within d, you’re talking in terms of “commands”. When I think of non-path versus path elements, I like to think that the reason why we have to write much more complex drawing instructions is this: All non-path elements are just dumber paths. In the background, they have one pre-drawn path shape that they will always render based on a few parameters you pass in. But path has no default shape. The shape logic has to be exposed to you, while it can be neatly hidden away for all other elements. Let’s learn about those commands. Where It All Begins: M The first, which is where each path begins, is the M command, which moves the pen to a point. This command places your starting point, but it does not draw a single thing. A path with just an M command is an auto-delete when cleaning up SVG files. It takes two arguments: the x and y coordinates of your start position. const uselessPathCommand = `M${start.x} ${start.y}`; Basic Line Commands: M , L, H, V These are fun and easy: L, H, and V, all draw a line from the current point to the point specified. L takes two arguments, the x and y positions of the point you want to draw to. const pathCommandL = `M${start.x} ${start.y} L${end.x} ${end.y}`; H and V, on the other hand, only take one argument because they are only drawing a line in one direction. For H, you specify the x position, and for V, you specify the y position. The other value is implied. const pathCommandH = `M${start.x} ${start.y} H${end.x}`; const pathCommandV = `M${start.x} ${start.y} V${end.y}`; To visualize how this works, I created a function that draws the path, as well as points with labels on them, so we can see what happens. See the Pen Simple Lines with path [forked] by Myriam. We have three lines in that image. The L command is used for the red path. It starts with M at (10,10), then moves diagonally down to (100,100). The command is: M10 10 L100 100. The blue line is horizontal. It starts at (10,55) and should end at (100, 55). We could use the L command, but we’d have to write 55 again. So, instead, we write M10 55 H100, and then SVG knows to look back at the y value of M for the y value of H. It’s the same thing for the green line, but when we use the V command, SVG knows to refer back to the x value of M for the x value of V. If we compare the resulting horizontal path with the same implementation in a <line> element, we may Notice how much more efficient path can be, and Remove quite a bit of meaning for anyone who doesn’t speak path. Because, as we look at these strings, one of them is called “line”. And while the rest doesn’t mean anything out of context, the line definitely conjures a specific image in our heads. <path d="M 10 55 H 100" /> <line x1="10" y1="55" x2="100" y2="55" /> Making Polygons And Polylines With Z In the previous section, we learned how path can behave like <line>, which is pretty cool. But it can do more. It can also act like polyline and polygon. Remember, how those two basically work the same, but polygon connects the first and last point, while polyline does not? The path element can do the same thing. There is a separate command to close the path with a line, which is the Z command. const polyline2Points = M${start.x} ${start.y} L${p1.x} ${p1.y} L${p2.x} ${p2.y}; const polygon2Points = M${start.x} ${start.y} L${p1.x} ${p1.y} L${p2.x} ${p2.y} Z; So, let’s see this in action and create a repeating triangle shape. Every odd time, it’s open, and every even time, it’s closed. Pretty neat! See the Pen Alternating Triangles [forked] by Myriam. When it comes to comparing path versus polygon and polyline, the other tags tell us about their names, but I would argue that fewer people know what a polygon is versus what a line is (and probably even fewer know what a polyline is. Heck, even the program I’m writing this article in tells me polyline is not a valid word). The argument to use these two tags over path for legibility is weak, in my opinion, and I guess you’d probably agree that this looks like equal levels of meaningless string given to an SVG element. <path d="M0 0 L86.6 50 L0 100 Z" /> <polygon points="0,0 86.6,50 0,100" /> <path d="M0 0 L86.6 50 L0 100" /> <polyline points="0,0 86.6,50 0,100" /> Relative Commands: m, l, h, v All of the line commands exist in absolute and relative versions. The difference is that the relative commands are lowercase, e.g., m, l, h, and v. The relative commands are always relative to the last point, so instead of declaring an x value, you’re declaring a dx value, saying this is how many units you’re moving. Before we look at the example visually, I want you to look at the following three-line commands. Try not to look at the CodePen beforehand. const lines = [ { d: `M10 10 L 10 30 L 30 30`, color: "var(--_red)" }, { d: `M40 10 l 0 20 l 20 0`, color: "var(--_blue)" }, { d: `M70 10 l 0 20 L 90 30`, color: "var(--_green)" } ]; As I mentioned, I hate looking at numbers without meaning, but there is one number whose meaning is pretty constant in most contexts: 0. Seeing a 0 in combination with a command I just learned means relative manages to instantly tell me that nothing is happening. Seeing l 0 20 by itself tells me that this line only moves along one axis instead of two. And looking at that entire blue path command, the repeated 20 value gives me a sense that the shape might have some regularity to it. The first path does a bit of that by repeating 10 and 30. But the third? As someone who can’t do math in my head, that third string gives me nothing. Now, you might be surprised, but they all draw the same shape, just in different places. See the Pen SVG Compound Paths [forked] by Myriam. So, how valuable is it that we can recognize the regularity in the blue path? Not very, in my opinion. In some cases, going with the relative value is easier than an absolute one. In other cases, the absolute is king. Neither is better nor worse. And, in all cases, that previous example would be much more efficient if it were set up with a variable for the gap, a variable for the shape size, and a function to generate the path definition that’s called from within a loop so it can take in the index to properly calculate the start point. Jumping Points: How To Make Compound Paths Another very useful thing is something you don’t see visually in the previous CodePen, but it relates to the grid and its code. I snuck in a grid drawing update. With the method used in earlier examples, using line to draw the grid, the above CodePen would’ve rendered the grid with 14 separate elements. If you go and inspect the final code of that last CodePen, you’ll notice that there is just a single path element within the .grid group. It looks like this, which is not fun to look at but holds the secret to how it’s possible: <path d="M0 0 H110 M0 10 H110 M0 20 H110 M0 30 H110 M0 0 V45 M10 0 V45 M20 0 V45 M30 0 V45 M40 0 V45 M50 0 V45 M60 0 V45 M70 0 V45 M80 0 V45 M90 0 V45" stroke="currentColor" stroke-width="0.2" fill="none"></path> If we take a close look, we may notice that there are multiple M commands. This is the magic of compound paths. Since the M/m commands don’t actually draw and just place the cursor, a path can have jumps. So, whenever we have multiple paths that share common styling and don’t need to have separate interactions, we can just chain them together to make our code shorter. Coming Up Next Armed with this knowledge, we’re now able to replace line, polyline, and polygon with path commands and combine them in compound paths. But there is so much more to uncover because path doesn’t just offer foreign-language versions of lines but also gives us the option to code circles and ellipses that have open space and can sometimes also bend, twist, and turn. We’ll refer to those as curves and arcs, and discuss them more explicitly in the next article. Further Reading On SmashingMag “Mastering SVG Arcs,” Akshay Gupta “Accessible SVGs: Perfect Patterns For Screen Reader Users,” Carie Fisher “Easy SVG Customization And Animation: A Practical Guide,” Adrian Bece “Magical SVG Techniques,” Cosima Mielke