1 |
Skip to main content |
text |
2 |
Home |
text |
3 |
Tools |
text |
4 |
Pens |
text |
5 |
Articles |
text |
6 |
Gits |
text |
7 |
Portfolio |
text |
8 |
Escaping HTML 3rd April 2020 (incept: 24-02-2020) Replaces the characters: < > and & with HTML ent**ies < > and & to facilitate embedding code examples into a web page. |
text |
9 |
Circle of Fifths: Interactive SVG chord wheel 21st January 2020 (incept: 17-10-18) Find the guitar chords of most common keys using an interactive chord wheel. Built as an SVG representing the Major / Ionian scales. |
text |
10 |
Match element heights along a CSS grid row 17th June 2018 Maintains a consistent visual layout across a CSS grid-row when content size/length is variable in each grid-item. Image, heading and copy elements in each grid-item have their height dynamically adjusted across each grid row. |
text |
11 |
CSS Grid wallboard 28th August 2019 (incept: 24-02-2018) A fully responsive wallboard created with CSS grids.Uses a single image per grid item, without image scaling. |
text |
12 |
Vignette & brightness hover effect 28th July 2018 (incept: 17-02-2018) Concentrates user focus on the central area. Values are individually set in the HTML allowing for fine control in a production environment. |
text |
13 |
HTML 5.2 dialog element 28th July 2018 (incept: 08-01-2018) Trialing the new HTML 5.2 dialog element. JavaScript applied to work on any ES6 browser without dependencies. |
text |
14 |
Font size conversion: pixel-point-em-rem-percent 19th May 2020 (incept: 07-04-2010) Freely convert between pixels (px), points (pt), ems or rems, and percent (%) values. Primarily for font-sizes and media queries. Calculator and chart provided. |
text |
15 |
Fluid-responsive font-size calculator 19th May 2020 (incept: 03-03-2017) Easily generate fluid-responsive font values for embedding directly into your stylesheet. |
text |
16 |
SVG to CSS background-image converter 22nd January 2020 (incept: 22-06-2016) Reformat SVG images to URIs for use as, cross-browser, CSS background-images in your stylesheet. |
text |
17 |
Image to data-URI converter 24th February 2020 (incept: 28-01-2010) Convert images to base64 data-URIs for embedding as image URLs directly into HTML or stylesheets. |
text |
18 |
Displaying code in a web page 3rd April 2020 (incept: 25-01-2016) Easily add example code to your web page. Handles JavaScript, CSS, HTML, and PHP, Beautifully semantic. Minimum fuss–Maximum effect. |
text |
19 |
Centring vertically and horizontally in CSS 20th May 2020 (incept: 31-07-2017) Centring both vertically and horizontally, using various CSS methods, with support down to IE9. |
text |
20 |
FAQ using WAI-ARIA roles to meet WCAG 2 level AA 19th March 2017 (incept: 19-08-2016) Semantically correct FAQ with animated show-hide accordion style. Vanilla JavaScript toggles ARIA attributes which are animated via CSS. Questions may be set open on-load or via a URI fragment. |
text |
21 |
Crop copy then restore on-click 18th March 2017 (incept: 23-01-2017) Responsively crop your content copy down to a user-defined number of lines. Click to fully restore the content via a sliding drop-down animation. All delivered in an accessible manner. |
text |
22 |
Contact (launches email client) |
text |
23 |
Site-map |
text |
24 |
Accessibility |
text |
25 |
Privacy |
text |
26 |
T&Cs |
text |
27 |
© 2004 - 2020 webSemantics |
text |
28 |
Launch email client |
text |