Accent Color for Admin Buttons and Links
Changes the blue of primary buttons, links and focus rings across wp-admin to one accent color of your choice.
Snippet Library
WordPress code snippets, ready to use
3,040 free snippets from the WPIDE team and the community. Copy the code, or add any snippet to your site in one click with WPIDE.
Accordion Style for the Details Block (SCSS)
Styles the core Details block as a polished accordion with borders, a rotating plus icon and comfortable spacing, so FAQs look finished without a plugin.
Admin Menu in Your Brand Colors
Recolors the admin sidebar menu and admin bar with your brand colors, set as a few SCSS variables at the top.
A–Z Index Styles (SCSS)
Styles the [az_index] letter bar as a row of buttons that stays visible while scrolling, and lays out each letter's entries in columns.
Brand Button Styles (SCSS)
Restyles theme and block buttons with your brand color, hover and focus states, generated from a few SCSS variables.
Breadcrumb Trail Styling (SCSS)
Styles breadcrumb trails from the Breadcrumbs shortcode and popular SEO plugins with smaller muted text, chevron separators and a clear current page.
Button Block Hover Effects (SCSS)
Adds a smooth lift, shadow and color shift when visitors hover over or focus Button blocks, with motion turned off for people who prefer reduced motion.
Button-Style Pagination (SCSS)
Turns the page numbers under the blog, archives and Query Loop blocks into evenly sized rounded buttons with a clear current-page state.
Buttons With Automatically Readable Text (SCSS)
Styles buttons from one brand color and picks black or white text automatically based on how light the color is, with matching hover and focus states, so button text always stays readable.
Card Layout for the Post Grid Shortcode (SCSS)
Styles the [post_grid] shortcode output as clean cards with rounded images, a subtle shadow on hover and clamped excerpts, respecting reduced-motion settings.
Card Style for Query Loop Posts (SCSS)
Turns each post in Query Loop blocks into a card with padding, rounded corners, a soft shadow and a lift on hover, for blog and archive templates in block themes.
Clean Comment Form Styles
Gives the comment form full-width fields, rounded corners, a clear focus color and a solid submit button that match your accent color.
Clean Table Styles for Posts (SCSS)
Gives tables in posts and pages a clean, readable look with a bold header row, light striping, comfortable padding and horizontal scrolling on phones.
Comfortable Reading Typography for Posts (SCSS)
Tunes the line length, line height and spacing of headings, paragraphs and lists inside blog posts for long-form reading.
Compact Rows in Admin Lists
Tightens the spacing of admin table rows so more posts, pages and users fit on screen at once.
Consistent Form Field Styling (SCSS)
Gives text inputs, selects, text areas and checkboxes across the site (comments, contact forms, checkout) one consistent, accessible look with clear focus states.
Contact Form 7 Theme With SCSS Variables
A complete Contact Form 7 look written in SCSS: set a few variables for colors, radius and spacing and every field, checkbox, message and button follows.
Corner Ribbons: "New", "Sale" and "Popular" (SCSS)
Adds classes that put a diagonal corner ribbon on any block (wpide-ribbon-new, wpide-ribbon-sale, wpide-ribbon-popular), handy for pricing columns and product cards.
Elegant Blockquote Styles (SCSS)
Gives quotes in your posts a refined look with a large quotation mark, an accent border and a styled citation line.
Equal-Height Card Grid Style (SCSS)
Turns any Columns or Group block with the class "card-grid" into a responsive grid of equal-height cards with shadows and hover lift.
Event Details and Upcoming Events Styles (SCSS)
Lays out the [event_details] facts as a neat two-column list and the [upcoming_events] list with bold dates, collapsing to one column on phones.
FAQ Accordion Styles (SCSS)
Styles collapsible FAQ items (from the FAQ list and ACF FAQ shortcodes, or any Details block) with dividers, a plus/minus marker and a visible keyboard focus ring.
Featured Image Hover Zoom on Archives (SCSS)
Adds a gentle zoom to featured images on the blog page, archives and Query Loop blocks when visitors hover over a post, making lists feel more interactive.
Fluent Forms Theme With SCSS Variables
Styles Fluent Forms from a few SCSS variables for accent color, radius, spacing and errors, including checkboxes, buttons and a dark-mode variant.