llms.txt
# Marko Denic
> Personal site of Marko Denic, software engineer and public mentor. Articles on web development and performance, free browser-based developer tools, and copy-paste HTML/CSS/JavaScript/WordPress snippets.
Every article is also available as clean Markdown: append `.md` to the URL (for example https://markodenic.com/urlsearchparams/ becomes https://markodenic.com/urlsearchparams.md), or request the page with an `Accept: text/markdown` header. The complete index of every page is in [llms-full.txt](https://markodenic.com/llms-full.txt).
## When to use this site
Use this site when you need:
- A hands-on [web development article](https://markodenic.com/blog/) on CSS, HTML, JavaScript, SEO, Git, hosting or developer careers
- A free [browser-based CSS generator](https://markodenic.com/tools/) for glassmorphism, neumorphism, gradients, shadows, border radius, buttons and more
- A copy-paste [snippet](https://markodenic.com/snippets/) for HTML, CSS, JavaScript or WordPress
- [Color shades and palettes](https://markodenic.com/colors/) with HEX, RGB, HSL and OKLCH values, CSS variables and Tailwind config
## Links
- Blog: https://markodenic.com/blog/
- Tools: https://markodenic.com/tools/
- Snippets: https://markodenic.com/snippets/
- Colors: https://markodenic.com/colors/
- Newsletter: https://markodenic.tech/
- RSS feed: https://markodenic.com/feed/
- Sitemap: https://markodenic.com/wp-sitemap.xml
- Popular pages sitemap: https://markodenic.com/sitemap-popular.xml
- Contact: https://markodenic.com/contact/
## Most read articles
- [CSS Tips and Tricks: 26 You Won’t See in Most Tutorials](https://markodenic.com/css-tips.md): 26 CSS tips and tricks with live demos: text-overflow ellipsis, line-clamp, calc(), position: sticky, scroll snap, gradient text and borders, CSS-only modals and tooltips. Most need no JavaScript.
- [HTML Tips and Tricks: 20 You Won’t See in Most Tutorials](https://markodenic.com/html-tips.md): 20 HTML tips and tricks with examples: mailto and tel links, open links in a new tab, lazy loading, a native accordion, range sliders, fieldset, download links and more. No JavaScript needed.
- [Use Google like a pro](https://markodenic.com/use-google-like-a-pro.md): Googling is one of the most important skills for every developer. Let me show you how to get better at Googling.
- [console.log() in JavaScript: What It Is + 10 Pro Tips](https://markodenic.com/use-console-log-like-a-pro.md): What console.log() does, how to use it, and 10 lesser-known console methods (table, group, time, assert) that make JavaScript debugging faster.
- [Free certifications for developers](https://markodenic.com/free-certifications-for-developers.md): Certifications can be costly, so I prepared a list of free ones you can take and enhance your credibility.
- [CSS Generators](https://markodenic.com/css-generators.md): You can use CSS generators to avoid some time-consuming tasks.
- [Free Courses](https://markodenic.com/free-courses.md): Education does not have to cost a fortune. I made a list of free courses for you.
- [Make your first open source contribution](https://markodenic.com/make-your-first-open-source-contribution.md): A step-by-step guide to making your first open-source contribution.
- [Free Web Development Resources](https://markodenic.com/free-web-development-resources.md): So, you need some web development resources. Search no more.
- [JavaScript Tips](https://markodenic.com/javascript-tips.md): Let me share with you some really handy JavaScript tips.
- [50 free tools and resources (Part 2)](https://markodenic.com/50-free-tools-and-resources-part-2.md): Free stuff is always exciting. But, what if it is free and awesome?
- [CSS Pulse Animation](https://markodenic.com/css-pulse-animation.md): Enhance user engagement with a smooth pulse animation! This eye-catching effect is perfect for quickly grabbing attention and improving UI interaction. Learn how to implement it now!
- [GitHub repositories to improve skills](https://markodenic.com/github-repositories.md): Free programming books, algorithms, public APIs, and much more.
- [50 Free Tools and Resources for Web Developers](https://markodenic.com/50-free-tools-and-resources.md): A hand-picked list of 50 free tools for web developers: CSS generators, code formatters, UI component libraries, icons and more. Every link manually checked.
- [17 Profitable Business Ideas for Web Developers](https://markodenic.com/17-profitable-business-ideas-for-web-developers-to-start-in-2022.md): The best businesses do not strive on mere “ideas”. They succeed when you solve a problem with a mission and vision.
- [Introduction to CSS if Statements and Conditional Logic](https://markodenic.com/introduction-to-css-if-statements-and-conditional-logic.md): Conditional logic is a familiar concept to anyone who has written a programming language. Languages like JavaScript or Python use if/else statements to evaluate expressions and execute different blocks of code depending on whether the condition is true or false.
- [10 array methods to simplify your code](https://markodenic.com/10-javascript-array-methods-to-simplify-your-code.md): Explanations and examples included. Check it out.
- [Interactive learning tools](https://markodenic.com/interactive-learning-tools.md): Learning how to code in an interactive way is much more fun.
- [Best Websites To Get HTML/CSS Templates](https://markodenic.com/best-websites-to-get-html-css-templates.md): This roundup will save you hours of wasted search time and license headaches.
- [CSS Tutorial](https://markodenic.com/css-tutorial.md): CSS tutorial to kick-start your CSS journey, creating visually appealing web pages by exploring core elements, properties, and techniques.
## Latest articles
- [URLSearchParams: Read and Update URL Query Parameters in JavaScript](https://markodenic.com/urlsearchparams.md): How to use URLSearchParams in JavaScript: get, set, append and delete query parameters, read the current URL, update it without reloading, build fetch URLs, and avoid the common gotchas.
- [CSS !important: What It Does and When to Use It](https://markodenic.com/css-important.md): What !important does in CSS, how it beats specificity, how to override an !important rule, how it works with cascade layers and JavaScript, and better alternatives for most cases.
- [Is HTML a Programming Language? (And What About CSS?)](https://markodenic.com/is-html-a-programming-language.md): Is HTML a programming language? No, it's a markup language. Here's what that means, how HTML, CSS and JavaScript differ, why CSS is a closer call, and why the label doesn't matter for your career.
- [How to Send Code Blocks in Discord (With Syntax Highlighting)](https://markodenic.com/discord-code-block.md): Send code in Discord the right way: inline code, multi-line code blocks, syntax highlighting for JavaScript, Python, CSS and more, colored text with diff, and what to do with code that's too long.
- [CSS ::before and ::after Pseudo-Elements (With Examples)](https://markodenic.com/css-before-after.md): How CSS ::before and ::after work: the content property, the difference between them, and practical examples like icons, custom bullets, overlays, tooltips and decorative shapes.
- [requestAnimationFrame Explained (With Examples)](https://markodenic.com/requestanimationframe.md): How requestAnimationFrame works in JavaScript: the animation loop, delta time for smooth motion on any screen, cancelAnimationFrame, throttling scroll handlers, and when to use CSS instead.
- [SEO Checklist for Developers: What Actually Matters](https://markodenic.com/seo-checklist-for-developers.md): A practical SEO checklist for developers: get pages crawled, indexed, ranked and clicked. What Google actually uses, what to skip, and how to check it in Search Console.
- [How to Open a Link in a New Tab (HTML target=”_blank”)](https://markodenic.com/open-link-in-new-tab.md): Open a link in a new tab with target="_blank": the HTML, rel="noopener noreferrer" and why it matters, JavaScript window.open(), accessibility, and when you shouldn't do it.
- [Fix “Cannot use import statement outside a module” in JavaScript](https://markodenic.com/cannot-use-import-statement-outside-a-module.md): Why you get "SyntaxError: Cannot use import statement outside a module" and how to fix it in the browser, Node.js, TypeScript and Jest, with the exact change for each case.
- [CSS Grid: grid-template-columns, fr and repeat() Explained](https://markodenic.com/css-grid.md): Learn CSS Grid with live examples: grid-template-columns, the fr unit, repeat(), minmax(), auto-fill vs auto-fit, grid-template-areas and responsive grids without media queries.
## Tools
- [CSS Text Shadow Generator](https://markodenic.com/tools/text-shadow-generator/): Free CSS text-shadow generator with live preview. Stack up to 8 shadow layers, start from 10 presets (glow, neon, 3D, retro, outline, fire) and copy the CSS or Tailwind class.
- [CSS Box Shadow Generator](https://markodenic.com/tools/box-shadow-generator/): Free CSS box-shadow generator with live preview. Stack up to 8 shadow layers, add inset shadows, start from 12 presets (soft, layered, neumorphic, glow) and copy the CSS or Tailwind class.
- [CSS Gradient Generator: Linear, Radial & Conic](https://markodenic.com/tools/css-gradient-generator/): Free CSS gradient generator. Create linear, radial and conic gradients, pick from presets, then copy the CSS or Tailwind class or download a PNG wallpaper.
- [CSS Pulse Animation Generator](https://markodenic.com/tools/pulse-animation-generator/): Free CSS pulse animation generator. Pick ring, glow, scale or fade, set color, size and speed, and copy the keyframes. Reduced-motion safe.
- [Border Radius Generator: CSS Rounded Corners](https://markodenic.com/tools/border-radius-generator/): Free CSS border-radius generator. Set each corner in px or %, try presets like pill, circle and leaf, and copy the CSS in one click.
- [Neumorphism CSS Generator](https://markodenic.com/tools/neumorphism-css-generator/): Easily generate soft UI and Neumorphism CSS styles. Customize colors, shadows, and copy the code.
- [CSS Button Generator: 127 CSS Buttons to Customize & Copy](https://markodenic.com/tools/buttons-generator/): Design CSS buttons visually: start from 127 ready-made buttons, adjust colors, size, radius and text with a live preview, then copy the HTML and CSS or download a PNG.
- [Tech Acronyms (Initialisms) Explorer](https://markodenic.com/tools/tech-acronyms-explorer/): Look up hundreds of tech acronyms and abbreviations instantly. The Tech Acronyms Explorer is a free tool for developers and IT professionals who want quick, clear definitions of technology initialisms.
- [Glassmorphism CSS Generator](https://markodenic.com/tools/glassmorphism-css-generator/): Free glassmorphism generator: adjust blur, transparency and color, preview the frosted glass effect live, and copy the CSS in one click.
- [QR code generator](https://markodenic.com/tools/qr-code-generator/): Use this free QR code generator to easily create custom QR codes for links, text, and more in just a few clicks.
## Snippets
- [HTML snippets](https://markodenic.com/snippets/html/)
- [CSS snippets](https://markodenic.com/snippets/css/)
- [JavaScript snippets](https://markodenic.com/snippets/javascript/)
- [WordPress snippets](https://markodenic.com/snippets/wordpress/)
