• Stars
    star
    232
  • Rank 172,847 (Top 4 %)
  • Language
    JavaScript
  • Created over 8 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Document tree for given HTML with BEM errors and headers hierarchy

html-tree

http://yoksel.github.io/html-tree/


RU | EN ↓

Генератор дерева на основе HTML-разметки.

Вставьте в левое поле HTML-код, и справа появится дерево документа в виде вложенных списков:

Генератор дерева на основе HTML-разметки

Бонусом делается простая проверка БЭМ-нотации и иерархии заголовков:

Подсветка БЭМ-ошибок

Кликните по классу, чтобы подсветить его:

Выборочная подсветка кода


RU ↑ | EN

HTML Tree Generator

Insert the HTML code to the left textarea, and the document tree will appear on the right as nested lists:

HTML Tree Generator

As a bonus there is a simple check of BEM notation and header hierarchy:

Highlighting errors

Click on class to highlight it:

Highlighting classes

More Repositories

1

common-words

🧐 Слова, часто используемые в CSS-классах
3,135
star
2

flex-cheatsheet

📖 Flexbox cheatsheet
JavaScript
1,330
star
3

url-encoder

🛸 Url-encoder, useful for SVG
JavaScript
1,202
star
4

svg-filters

✨ SVG Filters Playground
JavaScript
285
star
5

relative-clip-path

Convert path to relative to make it flexible in CSS property clip-path
JavaScript
177
star
6

pixel-glass-js

🔮 Tiny JS library for visual checking markup
JavaScript
157
star
7

grid-cheatsheet

CSS Grid cheat sheet
JavaScript
151
star
8

svg-gradient-map

🌈 Tool for creating SVG Filters with Gradient Map
JavaScript
150
star
9

tutors-tools

Инструменты и ссылки для наставников
82
star
10

easy-markup

Подсказки по разметке HTML-документа
TypeScript
64
star
11

snowflake

Snowflake editor on Web Components
JavaScript
37
star
12

handy-colors

List of named colors + palettes
HTML
35
star
13

emoji-brush

🎨 Use emoji like a brush
JavaScript
33
star
14

tema

🎨 Simple color themes generator
TypeScript
32
star
15

svg-fallback

HTML
29
star
16

yoksel

22
star
17

wave-maker

Wave maker based on SVG Arcs
JavaScript
22
star
18

bad-practices

Частые ошибки начинающих и способы их избежать
HTML
22
star
19

shadowPainter

Js-creator of box-shadow animation
JavaScript
18
star
20

time

Электронные часы. CSS + JS.
JavaScript
17
star
21

unicode-table

Таблица символов юникода
HTML
16
star
22

easy-css

Подсказки по написанию CSS
HTML
13
star
23

yoksel.github.io

Blog content, made on NextJS
HTML
11
star
24

harvester

JavaScript
10
star
25

svg-modify

Modify SVG by JSON
JavaScript
10
star
26

non-square-web

CSS
8
star
27

svg-dictionary

7
star
28

svg-filters-02-2018

HTML
6
star
29

grunt-svg-modify

Resize and color svg-images
HTML
6
star
30

create-component-files

JavaScript
5
star
31

variable-fonts

CSS
5
star
32

114660-cinemaddict-11

Киноман, учебный проект
JavaScript
4
star
33

colors-stats

JavaScript
4
star
34

a11y-demo

HTML
4
star
35

bem-newbie

JavaScript
4
star
36

double-range

🍬 Double range input made from two ordinary range inputs
JavaScript
4
star
37

benchmark

JavaScript
3
star
38

non-square-web-minsk

CSS
3
star
39

htmla-project-checker

JavaScript
3
star
40

not-just-text-04-2019

HTML
3
star
41

math-drills-generator

Simple tool for creation math drills pages
JavaScript
3
star
42

about-svg

CSS
2
star
43

funbox

SCSS
2
star
44

color-fonts-demo

Live examples of color fonts for testing in browsers
HTML
2
star
45

svgSymbolsShower

CSS
2
star
46

task-4-node

JavaScript
2
star
47

shop-admin-page

Training project
JavaScript
2
star
48

live-snippet

HTML
2
star
49

ally-for-logo

Accessibility for logotypes
HTML
2
star
50

speaking

HTML
2
star
51

project-scaffold

My simple scaffold for small projects
SCSS
2
star
52

tinylib.js

JavaScript
2
star
53

striped-cones

Striped Cones Generator
JavaScript
2
star
54

grunt-prototyper

HTML
1
star
55

handy-colors-extension

JavaScript
1
star
56

calculator

JavaScript
1
star
57

114660-taskmanager-11

Юлия Бухвалова
JavaScript
1
star
58

learn

Playground
CSS
1
star
59

svg-bugs

JavaScript
1
star
60

memorizer

JavaScript
1
star
61

kitch

JavaScript
1
star
62

svg-colors-extractor

Extracts colors from given SVG code
JavaScript
1
star